jquery - Calculate a total from autocomplete suggestion.data -
i'm trying write small jquery program autocomplete searchform. user able add items autocomplete form sort of shopping list. have difficulties finding way calculate , update total price of added products, tried store prices, in suggestion.data , tot add recusively total in total = total + suggestion.data, seems not way. me produce , display total? jquery code follows:
var price = {}; var name = {}; var totaal = {}; $(function () { var currencies = [ {value:'text-string',data:'5.50)'}, {value:'text-string2',data:'3.10)'}, ]; $('#autocomplete').autocomplete({ lookup: currencies, onselect: function (suggestion) { price.fff = suggestion.data; name.fff = suggestion.value; }, }); }); function addlistitem() { var write2 = price.fff; var write = $('#autocomplete').val(); var list = $('#itemlist'); var item = $('<li><span class="list">' + write + '</span><button class="delete">x</button></li>'); var autocomplete = $("#autocomplete"); if (write.length === 0 || write.length > 88) { return false; } if (write == name.fff) { list.append(item); list2.append(item2); $(autocomplete).val(''); } $(autocomplete).val(''); } function deleteitem() { $(this).parent().remove(); } $(function () { var add = $('#additem'); var autocomplete = $('#autocomplete'); var list = $('#itemlist'); add.on('click', addlistitem); list.on('click', '.delete', deleteitem); autocomplete.on('keypress', function (e) { if (e.which == 13) { addlistitem(); } } and html looks like:
<body> <div id="box-1"> </div> <div id="box-2"> </div> <div id="page"> <h1>shop</h1> </div> <div id="main"> <div id="top"> <div id="form"> <div id="searchfield"> <input type="text" id="autocomplete" name="currency" class="biginput" placeholder="add items below"> <input type="submit" id="additem" value="+"> </div> <div class="line"> </div> </div> <div id="bottom"> <div class="items"> <ul id="itemlist"> </ul> </div> </div>
keep added item in array prices, can recalculate total @ time. don't forget remove array when removing list.
don't keep data in dom, use dom display info in model.
Comments
Post a Comment