javascript - Traverse a table using jQuery, XML, JSON, JS -

Sorry for the misleading title, but I'm sure how to write it.

I have the table below ...

I want to create a simple calculator that compares all the data in a row with 2 parameters.

I will ask my users to select a country before, and then select a value in that column, after doing this, you can submit the form and output the right values ​​from that line

I promised to try and show what I mean ...

What is the best way to do this ? The only way I know is that if a bigger / other statement is done by those who will write to me forever.

  $ ('country'). ('Change', function () {// if the US goes slow, then ($ (this) .val () == 'USA') {$ ('hidden grade'). Hide (); $ ('.inValusa'). Show ();} and if ($ (this) .val () == 'GB') {$ ('hidden'). Hide (); $ ('.inValgb' ). Show ();} and {$ ('hidden grade'). Hidden (); $ ('.inivalfr'). Show ();}}); $ ('Input [type = "submit"]'). ('Click', function (e) {e.preventDefault (); $ ('p'). Text ('value here output');});  

---

If you select French and 5a + then you will see 5.8 and V-Diff Output will receive ...

There are definitely different ways to do this, but I suppose Is that it comes down to the data structure. I personally go with a data structure, which has an array of countries with grades. Grades will actually be in pairs (display value / actual value) in account for intervals in the data. The trick here is that we do not want to display empty display values ​​in the selection, but we need the data to convert (in the real value). After that, the content of jQuery is very simple.

Data like this:

  var countrygrades = [country: "France", Grade: ["" 4 "" 5b "," 5A " ], "[5 b", "5 b"], ["5b +", "4"], ["5" 5b "", [" 5 "," 5c "], [" 5C + "," 5C + "], [" 6A "," 6A "], [" 6A + "," 6A + "], ["6b" 6b "]]}, {Country:" USA ", Grade: [[" 5.6 "," 5.6 "], [" "," 5.6 "], [" 5.7 "," 5.7 "], ["5.8", "5.8"], ["5.8", "5.8"], ["5.8"], ["5.9", "5.9"], ["5.10a", "5.10a"], ["510b", "5.10b"], ["5.10c", "5.10c"], ["5.10d", "5.10d"]]}, {Country: "UK", Grade: [[" "", "", "", "", "", "", "", "", "", " ], ["4b" "4b"], ["4B VS", "4B VS"], ["4C HVS", "4C HVS"], ["5A E1 "," 5 AE1 "], [" "," "], [" "," "]]}];  

event handling, etc. By the way:

  function loadgrad (countrygrades index) {var grade selection = $ ("# grade"); GradeSelect.empty (); $ .each Grade, Function (Index, Grade) {if (Grade [0]! = "") {Grade Selection.Append ($ ("<" & lt; option & gt; & lt; / Option & gt; "). Attr (" value ", index) .text (grade [0]));}}); ATR ("value", index) .text ("value", index) .text ("value", index) .text ("value", index) .text ("value", index) countrygrad. Country));}); $ ("#include"). ("Change", function () {loadgrads ($ ("# country"). Val ());}); LoadGrades (0); $ ("#convert"). Val (); var grade conference = ""; $ .EEC (countrygrand, function (countrygrades index) {grade conversion [======================================================================================================= { Countrygrad [countrygrad index] country + ":" + countrygrades [countryread indies] grade [grade index] [1] + "
";}); $ ("#conversion"). Html Grade conversion);});  

See one JSFDial here: