繁体   English   中英

如何从Excel工作表或.csv文件向jsfiddle下拉列表输入数据?

[英]How to input data to jsfiddle dropdown from an Excel Sheet or .csv file?

我有一个可以使用JS Fiddle下拉列表填充州和城市的要求。 我在这样的Excel工作表中有数据

State           City
Andhra Pradesh  Kadapa
Andhra Pradesh  Kadiri
Andhra Pradesh  Kagaznagar
Andhra Pradesh  Kakinada
Andhra Pradesh  Kalyandurg
Andhra Pradesh  Kamareddy
Assam           Karimganj
Assam           Kokrajhar
Bihar           Katihar
Bihar           Kanti
Bihar           Kishanganj
Bihar           Khagaria
Bihar           Kharagpur
Chhattisgarh    Kawardha
Chhattisgarh    Kanker
Chhattisgarh    Korba
Chhattisgarh    Kondagaon
Gujarat         Kapadvanj
Gujarat         Karjan
Gujarat         Kalavad
Gujarat         Kadi
Gujarat         Kalol
Haryana         Karnal
Haryana         Kalan Wali
Haryana         Kaithal

和用于填充下拉列表的js小提琴如下

--from here I want to input data from excel sheet or CSV or any other better suggestions in place of following code.
var data = [ // The data
    ['ten', [
        'select','eleven','twelve'
    ]],
    ['twenty', [
        'twentyone', 'twentytwo'
    ]]
];
--up to here.-----------------------------------

现在我想将数据传递给以下功能

$a = $('#State'); // The dropdowns
$b = $('#City');

for(var i = 0; i < data.length; i++) {
    var first = data[i][0];
    $a.append($("<option>"). // Add options
       attr("value",first).
       data("sel", i).
       text(first));
}

$a.change(function() {
    var index = $(this).children('option:selected').data('sel');
    var second = data[index][3]; // The second-choice data

    $b.html(''); // Clear existing options in second dropdown

    for(var j = 0; j < second.length; j++) {
        $b.append($("<option>"). // Add options
           attr("value",second[j]).
           data("sel", j).
           text(second[j]));
    }
}).change(); // Trigger once to add options at load of first choice

这是下拉列表

<select id=state></select></br>
<select id=city></select>

我关心的是如何

将文件转换为JSON数据以便于访问-数据不应该经常更改,因此这不成问题。 然后,您可以通过AJAX加载此文件:

$.getJSON('ajax/cities.json', function(data) {
    var $opt = $("<option>")
       .attr("value",data.city)
       .text(data.state);
    $('#state').append($opt);
});

...或类似的东西。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM