2016-04-05 11 views
0

この問題を解決する方法について質問があります。クライアントサイドのJS検証を使用しています。ラジオボタンの選択を確認するための特定のJSメソッドの検索

これは私が作成したオンライン注文システムで、管理者/管理者が&部分を注文して注文する機能を実装し終えたばかりです。そのアクションが選択されると、「何もしない」または「このアイテムをバックオーダーに分割する」というオプションを使用して、各広告申込情報の横にラジオボタンのペアを表示するJSが表示されます。選択された項目をその項目に移動し、それをバックオーダーにマークします。

このすべてが完璧に動作しますが、管理者/管理者はなく、いずれかの「&受注残分割」を選択したときの問題は次のとおりです。)
Aを
Bを分割するためには項目を選択していない)させるためにすべての項目を選択しますいずれかのオリジナルまたは分割ために潜在的にそれに取り付けられた商品を有しない得られた(検証目的のために、これはすべての項目を選択するのと同じである)だけ1ラインアイテムに&バックオーダーと注文を分割する試み)


Cを分割。

PHPの投稿を基本的に停止するJS検証を実行し、項目がないか、またはすべての項目が&のバックオーダーに分割されている場合にアラートを表示します。

私はJSの.onclick機能でこれをやって&アイテムが選択されたアイテム数をカウントアップし、比較するための変数でループを使用して見てきましたが、問題は、各順序で動作するように十分にこれがダイナミック作っていますフォームのラジオボタンの名前は、各注文に応じて変わります(PHPによって行われます)。 PHPでは、私はポストからループを使って配列を拡張していましたが、クライアントサイドJSでどこから始めるべきか分かりません。

+0

フィドルを作成してください – vishwa

答えて

0

以上I.

これは、我々が実装してしまったものです。この1で開始する場所を私は本当に知らなかった、と友人は周りの彼の方法を知っているたくさんJS誰私と一緒にそれを見て提供:

function validateAction() { 
    var $productRows = $(".product-row"); 
    var $productsToSplit = []; 
    $productRows.each(function(i) { 
    var splitChecked = $('input[type=radio][value=1]:checked', $productRows[i]); 
    if(splitChecked.length > 0) $productsToSplit.push(splitChecked[0]); 
    }); 
    //console.log($productsToSplit); 

    switch($productsToSplit.length) { 
     case 0: 
      alert('No products have been selected to split & backorder. Please check your selection and try again.'); 
      event.preventDefault(); 
      break; 
     case $productRows.length: 
      alert('You cannot select all products in an order to split & backorder. Please check your selection and try again.'); 
      event.preventDefault(); 
      break; 
    } 
    //console.log($productsToSplit.length + " : " + $productRows.length); 

}; 

我々は、各製品の行の本部へのクラス「productRows」を追加することになったので、私たちはその後、確認のラジオボタン要素を取得し、当社の検証を行うことができます。これは関連するHTMLです:

<div class="row product-row"> 
       <!-- Div to show checkbox when Split Order is selected --> 
       <div class= "flat-green splititemchkbox" style="display:none" id="splititemchkbox"> 
        <input type="hidden" name="splitbackitem[<?= @$prod['id'];?>][id]" value=<?= @$prod['id'];?>> 

        <input type="radio" style="transform: scale(2)" name="splitbackitem[<?= @$prod['id'];?>][checked]" value="0" checked="checked"> 
        <label style="margin: 1%">Do Nothing</label> 
        <input type="radio" style="transform: scale(2)" name="splitbackitem[<?= @$prod['id'];?>][checked]" value="1"> 
        <label style="margin-left: 1%">Split Item to Backorder</label> 
       </div> 

似たような解決策を探している人に役立ちます。

乾杯

関連する問題