2

在 Webmatrix 中使用 asp.net，我创建了一个下拉菜单，您可以在其中选择一个状态，然后基于该选择有另一个下拉菜单供用户选择该状态内的一个区域。

我遇到的问题是，当数据发布时，它会为未选择的其他区域添加一堆逗号。我可以看到这是如何发生的，区域的每个选择标签都有 name="Region"，但是我不知道如何解决这个问题，它们都嵌套在 div 标签中我不能使用 'name' 属性. 如果在某个地方没有名称，则区域字段不会发布到数据库中。

这是html代码：

<label>State:</label>
   <select class="stareg" id="SelectState" name="State" size="1">
        <option value="">Please Select</option>
        <option value="ACT">A.C.T.</option>
        <option value="NSW">New South Wales</option>
        <option value="NT">Northern Territory</option>
        <option value="QLD">Queensland</option>
        <option value="SA">South Australia</option>
        <option value="TAS">Tasmania</option>
        <option value="VIC">Victoria</option>
        <option value="WA">Western Australia</option>
    </select>

   <label>Region:</label>

         <div id="SelectRegion">
    <div>
         <div>
            <select class="stareg" name="Region">
                <option value="">Please Select</option>
               </select>
        </div>
    </div>

    <div id="VIC" style="display: none;">
         <div id="VICReg">
            <select class="stareg" id="VICRegs" name="Region">
                <option value="">Please Select</option>
                <option value="Melbourne & Inner Suburbs">Melbourne & Inner Suburbs</option>
                <option value="East & South East">East & South East Suburbs</option>
                <option value="Geelong">Geelong</option>
                <option value="Gippsland">Gippsland</option>
                <option value="Mornington Peninsula">Mornington Peninsula</option>
                <option value="North & West Suburbs">North & West Suburbs</option>
                <option value="Yarra Valley & Dandenong Ranges">Yarra Valley & Dandenong Ranges</option>
                <option value="Regional Victoria">Regional Victoria</option>
            </select>
        </div>
    </div>

    <div id="NSW" style="display: none;">
          <div id="NSWReg">
            <select class="stareg" id="NSWRegs" name="Region">
                <option value="">Please Select</option>
                <option value="Sydney & Inner Suburbs">Sydney & Inner Suburbs</option>
                <option value="Central West">Central West</option>
                <option value="Hunter">Hunter</option>
                <option value="North Coast">North Coast</option>
                <option value="South Coast">South Coast</option>
                <option value="Southern Inland">Southern Inland</option>
                <option value="Western Sydney">Western Sydney</option>
                <option value="Regional N.S.W.">Regional N.S.W.</option>

            </select>
        </div>
    </div>

    <div id="QLD" style="display: none;">
          <div id="QLDReg">
            <select class="stareg" id="QLDRegs" name="Region">
                <option value="">Please Select</option>
                <option value="Brisbane & Inner Suburbs">Brisbane & Inner Suburbs</option>
                <option value="Bundaberg">Bundaberg</option>
                <option value="Cairns">Cairns</option>
                <option value="Gold Coast">Gold Coast</option>
                <option value="Mackay">Mackay</option>
                <option value="Sunshine Coast">Sunshine Coast</option>
                <option value="Townsville">Townsville</option>
                <option value="Regional QLD">Regional QLD</option> 
            </select>
        </div>
    </div>

    <div id="SA" style="display: none;">
          <div id="SAReg">
            <select class="stareg" id="SARegs" name="Region">
                <option value="">Please Select</option>
                <option value="Adelaide & Inner Suburbs">Adelaide & Inner Suburbs</option>
                <option value="Adelaide Hills">Adelaide Hills</option>
                <option value="Barossa">Barossa</option>
                <option value="Clare Valley">Clare Valley</option>
                <option value="Eyre Peninsula">Eyre Peninsula</option>
                <option value="Fleurieu Peninsula">Fleurieu Peninsula</option>
                <option value="Kangaroo Island">Kangaroo Island</option>
                <option value="Limestone Coast">Limestone Coast</option>
                <option value="Murraylands">Murraylands</option>
                <option value="Yorke Peninsula">Yorke Peninsula</option>
                <option value="Regional S.A.">Regional S.A.</option> 
            </select>
        </div>
    </div>

    <div id="WA" style="display: none;">
          <div id="WAReg">
            <select class="stareg" id="WARegs" name="Region">
                <option value="">Please Select</option>
                <option value="Perth & Inner Suburbs">Perth & Inner Suburbs</option>
                <option value="Great Southern">Great Southern</option>
                <option value="Peel">Peel</option>
                <option value="South West">South West</option>
                <option value="Regional W.A.">Regional W.A.</option> 
            </select>
        </div>
    </div>

    <div id="ACT" style="display: none;">
          <div id="ACTReg">
            <select class="stareg" id="ACTRegs" name="Region">
                <option value="">Please Select</option>
                <option value="Canberra & Inner Suburbs">Canberra & Inner Suburbs</option>
                <option value="Other Area A.C.T">Other Area A.C.T</option>
            </select>
        </div>
    </div>

    <div id="TAS" style="display: none;">
          <div id="TASReg">
            <select class="stareg" id="TASRegs" name="Region">
                <option value="">Please Select</option>
                <option value="Hobart & Inner Suburbs">Hobart & Inner Suburbs</option>
                <option value="Davenport">Davenport</option>
                <option value="Launceston">Launceston</option>
                <option value="Regional Tasmania">Regional Tasmania</option>
            </select>
        </div>
    </div>

    <div id="NT" style="display: none;">
          <div id="NTReg">
            <select class="stareg" id="NTRegs" name="Region">
                <option value="">Please Select</option>
                <option value="Darwin & Inner Suburbs">Darwin & Inner Suburbs</option>
                <option value="Regional N.T.">Regional N.T.</option>
            </select>
        </div>
    </div>

</div>

这是 jquery 脚本：

$(function () {
    $('#SelectState').change(function () {
        $('#SelectRegion > div').hide();
        $('#SelectRegion').find('#' + $(this).val()).show();
    });
});

除了发送到数据库的附加逗号之外，一切都按我的意愿工作。有没有办法用一个名称包装所有区域选择标签，还是需要一些更高级的脚本？任何帮助都感激不尽。

4

1 回答 1

3

您的问题是因为您name对所有选择控件使用相同的参数：name="Region"，所以它们都一起发布。为什么 ？因为参数名称是回传的，而且你使用的都是一样的，所以它们用逗号混淆在一起。空逗号是您隐藏的逗号，如果我理解得很好，它们将不再被选中。

从我看到您知道自己在做什么的那一刻起，我就可以向您建议一个可能的解决方案，然后您就可以按照自己的方式去做。

.show()在 javascript 上制作 的那一刻，用 更改所有选择name=""，并只留下可见的：name="Region"。

javascript上的代码可以是：

$(function () {
  $('#SelectState').change(function () 
  {
    $('#SelectRegion > div').hide();

    // show the selected
    $('#SelectRegion').find('#' + $(this).val()).show();

    // remove the name from all that have the class stareg
    $('.stareg').attr('name', '')

    // set only to visible the class name
    $('#SelectRegion').find('#' + $(this).val() + 'Regs').attr('name', 'Region')

  });
});

我没有页面，所以可能需要一些 tweeks，我不确定最后一行是否正确找到了用于设置区域的选择控件。此外，我使用stareg该类从所有选择中删除名称 - 但不要对该页面上的其他控件使用相同的类。

于 2012-12-09T11:49:45.390 回答