Databases
StackOverflow2013
Postsdbo
PO
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>whooo, thats a hell lot of code for such a small task...</p> <p>anyways, in each of your "change-functions" you are reloading your other filter-selects. thats why the select boxes are reset</p> <p>e.g:</p> <pre><code>fxnSelectMake = function () { $('#tableID tr').remove(); g_newRows = ""; $.each(g_Vehicle, function (index) { if (g_Vehicle[index].Make == $('#DropDown_Make').val()) { fxnCreateRow(g_Vehicle, index); } }); $('#tableID').append(g_newRows); fxnReLoadingModelFilters(); // &lt;-- this is what i mean fxnReLoadingSubModelFilters(); // &lt;-- and this fxnReLoadingYearFilters(); // &lt;-- and this }, </code></pre> <p>but this is only part one. your main problem is this piece of code:</p> <pre><code>$.each(g_Vehicle, function (index) { if (g_Vehicle[index].Make == $('#DropDown_Make').val()) { fxnCreateRow(g_Vehicle, index); } }); </code></pre> <p>your g_Vehicle-Object is still the TOTAL object here, and you are just checking for the current selected value (not for year and so on)</p> <p>i have written a function "isInIndex" which checks all 4 current selected values, and only returns true, if the current vehicle row is valid for all 4 select boxes:</p> <pre><code>isInIndex = function(vehicle) { return ($("#DropDown_Year").prop("selectedIndex") === 0 || vehicle.Year === $('#DropDown_Year').val()) &amp;&amp; ($("#DropDown_Make").prop("selectedIndex") === 0 || vehicle.Make === $('#DropDown_Make').val()) &amp;&amp; ($("#DropDown_Model").prop("selectedIndex") === 0 || vehicle.Model === $('#DropDown_Model').val()) &amp;&amp; ($("#DropDown_SubModel").prop("selectedIndex") === 0 || vehicle.SubModel === $('#DropDown_SubModel').val()) } </code></pre> <p>then i call this function in each of your "change-functions":</p> <pre><code>$.each(g_Vehicle, function (index) { if (isInIndex(g_Vehicle[index])) { fxnCreateRow(g_Vehicle, index); } }); </code></pre> <p>the updated and working fiddle here: <a href="http://jsfiddle.net/pW6P6/10/" rel="nofollow">http://jsfiddle.net/pW6P6/10/</a></p> <p>edit: there are probably a lot of optimization-possibilities in your code, one of them is that you should save your jQuery-Objects into variables, and work with them:</p> <p>for example:</p> <pre><code>var $dropDownMake = $('#DropDown_Make'); // and later $dropDownMake.val() </code></pre>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload