PHP - 隐藏第2类选项列表中以前选择的类别

时间:2013-10-03 17:29:34

标签: javascript php jquery filter categories

这很简单。

当用户填写表单时,他们可以将列表分为两类。用户从下拉菜单中选择第一个类别后。如何在第二个下拉菜单中将该类别作为选项。

问题是,用户可以选择两次相同的类别。以下是我的基础:

            <li>
              <select name="category_1" tabindex="5">
                <option value="">Choose a category...</option>
                {foreach from=$cats item='cat'}
                  {if $cat.active}
                    <option value="{$cat.id}"{if $cat.id == $smarty.session.formVars.category_1} selected="selected"{/if}>{$cat.name} ({$cat.description})</option>
                  {/if}
                {/foreach}
              </select>
            </li>

            {if $smarty.session.formVars.category_2}
            <li>
              <select name="category_2">
                <option>Choose a category...</option>
                {foreach from=$cats item='cat'}
                  {if $cat.active}
                    <option value="{$cat.id}"{if $cat.id == $smarty.session.formVars.category_2} selected="selected"{/if}>{$cat.name} ({$cat.description})</option>
                  {/if}
                {/foreach}
              </select>
              <a href='#' class="category_delete">x</a>
            </li>
            {/if}

以下是当前的JS:

// Build category options
var cat_master = "";
$("#cat_master li").each(function(index, element) {
  cat_master += "<option value='" + $(element).find(".cat_id").text() + "'>" + $(element).find(".cat_name").text() + "</option>";
});

$(".category_add").click(function(e) {

  var cat_count = $("#categories > li").size();

  if (cat_count < AuthJ.Post.category_limit) {

    var next_cat = cat_count + 1;
    var new_select = "<select name='category_" + next_cat + "'><option value=''>Choose a category ...</option>" + cat_master + "</select>";

    $("#categories").append("<li>" + new_select + "</li>");

    // TODO: Remove previously selected categories from the new options list

    if (cat_count == (AuthJ.Post.category_limit - 1)) {
      $(this).hide(); // Hide the add new category link if we're at the category limit
    }

    $('<a href="#" class="category_delete">x</a>')
      .click(function(e){ deleteCategory(e, this); })
      .show()
      .appendTo('#categories > li:last');
  }

  e.preventDefault();
});

1 个答案:

答案 0 :(得分:0)

在下拉1的更改事件内部,在value_in_first_drop_down中获取下拉1的值并使用以下语法从第二次删除中删除

$(“#drop_down_2_id option [value = value_in_first_drop_down]”)。remove();

当用户从第一次下拉菜单中更改其选项时,您仍需要处理此案例。首先必须添加删除的元素,然后从第二个下拉列表中删除新选择的元素