Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 7 of 7
  1. #1
    New to the CF scene
    Join Date
    Sep 2012
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Point of sale style list

    jQuery and Javascript are rather foreign to me. PHP is my thing just cant get my head around javascript and such. So my sticking point is this:

    I am looking for something like this: http://www.codemashups.com/source/jq...tocomplete-p1/ I need the user to be able to enter a product description then they can select the right one in the drop down box. Then it fills in the rest of the form jumps to the number needed the user enters that presses enter and you can then add more items. Then it should need to return a current total cost with and with out VAT and such. Then when the user it done to enter the ID's of the products in a comma separated value list into a MySQL database along with the total cost.

    I would edit that one in the link but I'm at a total loss to what to do!

  • #2
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    2,925
    Thanks
    56
    Thanked 548 Times in 545 Posts
    You should at least make a start and come back with specific questions when you run into trouble. The tweaks you want to make are not so complicated, but people here tend to work on specific issues rather than coding complete projects.

    The example page you showed does many of the things you want. I guess you could start by adding the "with VAT" and "without VAT" values to the array of objects that gets pulled in.

    Keeping a running total is just a matter of updating some variable every time a selection is made, most logically when they choose an item from the autocomplete list, and then displaying the value of that variable somewhere else on the page.

    Formatting the user's selections is trivial. Sending it back to the database would I guess be a job for AJAX and php, which I assume you would be comfortable with.

  • #3
    New to the CF scene
    Join Date
    Sep 2012
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I would happily show something and ask for help but I dont know where to start to get something to show. I know the ideas behind what I wish to do but lack the knowledge to put them together. I will see what I can do in the mean time.

  • #4
    New to the CF scene
    Join Date
    Sep 2012
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I have something and it works! (Somewhat) but for the life of me get the values to multiply!

    PHP Code:
    <script type="text/javascript">
    $().
    ready(function() {
        
        $(
    "#itemdec").autocomplete("inc/get_item_list.php", {
            
    width260,
            
    matchContainstrue,
            
    mustMatchtrue,
            
    minChars2,
            
    //multiple: true,
            //highlight: false,
            //multipleSeparator: ",",
            
    selectFirsttrue
        
    });
        
        $(
    "#itemdec").result(function(eventdataformatted) {
            $(
    "#itemcode").val(data[1]);
            $(
    "#itemprice").val(data[2]);
                
    // Give focus to the next input field to recieve input from user
                
    $("input[name='itemqt']").focus();
        });
        
        

    });

    $(
    document).ready(function(){
        
      $(
    '#itemqt').keypress(function(){
        var 
    itemqt = $('#itemqt').val();  //get value of form field
        
        
    var itemprice = $('#itemprice').val();  //get value of form field
        
        
    var newVal itemqt itemprice;  //multiply
        
        
    $('#totalprice').val(newVal);  //change the form field's value to the result of the multiplication
      
    });
    });

    </script> 
    HTML:

    PHP Code:
    <form action="" id="itemsForm" >

                                    <
    table id="itemsTable" class="general-table">
                                        <
    thead>
                                        <
    tr>
                                            <
    th></th>
                                            <
    th>Item Code</th>
                                            <
    th>Item Description</th>
                                            <
    th>Item Qty</th>
                                            <
    th>Item Price</th>
                                            <
    th>Total Price</th>
                                        </
    tr>
                                        </
    thead>
                                        <
    tbody>
                                            <
    tr class="item-row">
                                              <
    td></td>
                                              <
    td><input type="text" name="itemcode" id="itemcode" /></td>
                                              <
    td><input type="text" name="itemdec" id="itemdec" /></td>
                                              <
    td><input type="text" name="itemqt" id="itemqt" /></td>
                                              <
    td>£<input type="text" name="itemprice" id="itemprice" /></td>
                                              <
    td>£<input type="text" name="totalprice" id="totalprice" /></td>
                                            </
    tr>
                                        </
    tbody>
                                    </
    table>

                                </
    form>

                                <
    a href="#" id="addRow" class="button-clean large"><span> <img src="images/icon-plus.png" alt="Add" title="Add Row" /> Add Item</span></a
    Also working on this add new row and the possibly complications of this.

  • #5
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    2,925
    Thanks
    56
    Thanked 548 Times in 545 Posts
    one problem you are going to have is using the onkeypress event. doing that, you grab the value of the box as the key is pressed ie, before the entered value appears in the box.

    I would try that function with a
    Code:
    $('#itemqt').keyup(function(){
    which waits until the key has been released before grabbing the value

  • #6
    New to the CF scene
    Join Date
    Sep 2012
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks that worked perfectly!

    Now for the other sections. I will be back...

  • #7
    New to the CF scene
    Join Date
    Sep 2012
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I have most of it working now! I just to work out how to delete the rows.
    Last edited by jiggles; 09-27-2012 at 02:31 AM.


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •