0

キーワードのリストがあり、それぞれにチェックボックスを作成しました。テンプレートにはコンテンツをラップするフォームがあるため、チェックボックスリストの周りにネストされたフォームを含めることはできません。

選択したチェックボックスの値を検索結果ページに送信するにはどうすればよいですか？

コンテンツをラップするフォームには、アクションやメソッドは適用されていません。

<form id="BoostMasterForm" runat="server">

これは私のチェックボックスリストのHTMLマークアップの例です（チェックボックスはキーワードによって異なります）：

<div class="checkboxes">
  <ul>
    <li>
      <input type="checkbox" name="search" class="options" value="one">
      <label>one</label>
    </li>
    <li>
      <input type="checkbox" name="search" class="options" value="two">
      <label>two</label>
    </li>
    <li>
      <input type="checkbox" name="search" class="options" value="three">
      <label>three</label>
    </li>
  </ul>
  <input type="submit" value="Submit"/>
</div>

javascriptまたはjQueryを使用して、複数のチェックボックスの選択値を送信し、送信アクションで次のURLに送信するにはどうすればよいですか：'/imagery/image-search.aspx'

オプション1と3が送信される検索の結果のURLは次のようになります：'/imagery/image-search.aspx?search=one%20three'

別の投稿で見つけたこのJavaScriptを使用していますが、フォーム、アクション、およびメソッドを追加するために必要です。私のウェブサイトはASPで、この投稿はPHPサイト用です。

複数のチェックボックスオプションを送信する

$('.options').click(function() {
    var selectedItems = new Array();
    $(".checkboxes input:checkbox[name=search]:checked").each(function() {selectedItems.push($(this).val());});
    var data = selectedItems.join('|');
    $("#opts").val(data);
});

誰かが助けてくれるなら、それは大いにありがたいです。

乾杯、JV

4

2 に答える 2

1

これはあなたの例で機能します。

$('input[type=submit]').on('click', function(evt) {
    var selectedValues = [];
    var url = '/imagery/image-search.aspx?search=';

    $('input[type=checkbox]:checked').each(function() {
        selectedValues.push($(this).val());
    });

    url += selectedValues.join(' ');

    window.location = url;
});​
于 2012-11-08T05:38:44.643 に答える
0

私はまだ明確ではありません。しかし、これは文字列を作成して渡すことができるコードです

    <script type="text/javascript">
function fnc()
{
    elements=document.getElementById("BoostMasterForm").elements;
    str="";
    for(i=0;i<elements.length;++i)
    {
        if(elements[i].type=='checkbox' && elements[i].checked)
        str=str+elements[i].value;
    }
    alert(str);
    //alert(window.location.href+'?str='+str);
//document.getElementById("aform").submit();
}
</script>

<form id="BoostMasterForm" onsubmit="fnc()">
<div class="checkboxes">
  <ul>
    <li>
      <input type="checkbox" id="search1" name="search" class="options" value="one">
      <label>one</label>
    </li>
    <li>
      <input type="checkbox" id="search2" name="search" class="options" value="two">
      <label>two</label>
    </li>
    <li>
      <input type="checkbox" id="search3" name="search" class="options" value="three">
      <label>three</label>
    </li>
  </ul>
  <input type="submit" value="Submit"/>
</div>
</form>
于 2012-11-08T05:15:53.940 に答える