2017-02-28 10 views
0

私のjQuery関数から未定義の出力が得られました。私は最初に空の文字列を私に割り当てましたproduct_type私はそれらの誰かを選択していないときに空にしたいしかし、まだundefined出力を得る。うまくいけば、私はここでいくつかのヒントを得ることができます。jQuery関数から未定義の出力を取得する

$(function() { 
 
    var internal_note = {}; 
 
    var customer_note = {}; 
 
    var product_type = ""; 
 
    var web_camera = ""; 
 
    var touch_screen = ""; 
 
    $("#test").on("click" , 'button:not(:disabled)',function(event){ 
 
     if ($('input[name="product_type"]:checked')){ 
 
      product_type = $('input[name="product_type"]:checked').attr("value"); 
 
     }; 
 
     if($('input[name="web_camera"]:checked')){ 
 
      web_camera = $('input[name="web_camera"]:checked').attr("value"); 
 
     }; 
 
     if($('input[name="touch_screen"]:checked')){ 
 
      touch_screen = $('input[name="touch_screen"]:checked').attr("value"); 
 
     }; 
 
     $('#left_note_list input').each(function(){ 
 
      internal_note[this.value] = JSON.stringify($(this).val()); 
 
     }); 
 
     alert(product_type); 
 
     $.ajax({ 
 
     type: "post", 
 
     url: '/insert/', 
 
     data: { 
 
     'internal_note': JSON.stringify(internal_note), 
 
     'product_type': JSON.stringify(product_type), 
 
     'web_camera': JSON.stringify(web_camera), 
 
     'touch_screen': JSON.stringify(touch_screen) 
 
     }, 
 
     success: function (data) { 
 
      swal(data,'You Click the Button','success'); 
 
      $("#test button:not(:disabled)").text('Done!').attr('disabled', 'disabled'); 
 
      }, 
 
     error: function(data){ 
 
      swal(data.responseText,'You Click the Button', 'error'); 
 
     } 
 

 
     }); 
 
    }); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
 
<div class="col-md-4"> 
 
    <h4 class="sub-header" id="product_type">Product Type</h4> 
 
         <form> 
 
          <div class="radio"><label><input type="radio" name="product_type" value="Laptop">Laptop</label></div> 
 
          <div class="radio"><label><input type="radio" name="product_type" value="Tower">Tower</label></div> 
 
          <div class="radio"><label><input type="radio" name="product_type" value="Minitower">Minitower</label></div> 
 
          <div class="radio"><label><input type="radio" name="product_type" value="Small Form Factor">Small Form Factor</label></div> 
 
         </form> 
 
        </div><!-- /.col-lg-4 Product Type--> 
 
        
 
       <div class="text-center" id="test"> 
 
       <button target="_blank" 
 
        class="btn btn-primary "> 
 
        Test 
 
       </button> 
 
       </div>

+1

この問題をプランナーまたは何か同等ですか?投稿されたコードから何が起こっているのか分かりにくいです。 – TheMiddleMan

+0

あなたの質問は不明ですが、いつ定義されていませんか? '#test'をクリックしたら? –

+0

@ A.Lau質問を更新しました。すべて –

答えて

1

チェックボックスがオンになっているかどうかを確認する方法から問題が発生しています。これはチェックの場合if ($('input[name="product_type"]:checked'))です。これはうまくいきますが、あなたは本当の、あるいは偽の答えを返さないので、本質的に真実をチェックしています。チェックボックスがチェックされているかどうかを確認する方法について良い記事があるあなたは$('input[name="product_type"]:checked')の長さをチェックするか、またはあなたがここでは、この代わりに

$('input[name="product_type"]').is(":checked")

を行うことができます

jQuery if checkbox is checked

$(function() { 
 
    var internal_note = {}; 
 
    var customer_note = {}; 
 
    var product_type = ""; 
 
    var web_camera = ""; 
 
    var touch_screen = ""; 
 
    $("#test").on("click" , 'button:not(:disabled)',function(event){ 
 

 
     if ($('input[name="product_type"]').is(":checked")){ 
 
      product_type = $('input[name="product_type"]:checked').attr("value"); 
 
     } 
 
     if($('input[name="web_camera"]:checked')){ 
 
      web_camera = $('input[name="web_camera"]:checked').attr("value"); 
 
     } 
 
     if($('input[name="touch_screen"]:checked')){ 
 
      touch_screen = $('input[name="touch_screen"]:checked').attr("value"); 
 
     } 
 
     $('#left_note_list input').each(function(){ 
 
      internal_note[this.value] = JSON.stringify($(this).val()); 
 
     }); 
 
     alert(product_type); 
 
     $.ajax({ 
 
     type: "post", 
 
     url: '/insert/', 
 
     data: { 
 
     'internal_note': JSON.stringify(internal_note), 
 
     'product_type': JSON.stringify(product_type), 
 
     'web_camera': JSON.stringify(web_camera), 
 
     'touch_screen': JSON.stringify(touch_screen) 
 
     }, 
 
     success: function (data) { 
 
      swal(data,'You Click the Button','success'); 
 
      $("#test button:not(:disabled)").text('Done!').attr('disabled', 'disabled'); 
 
      }, 
 
     error: function(data){ 
 
      swal(data.responseText,'You Click the Button', 'error'); 
 
     } 
 

 
     }); 
 
    }); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
 
<div class="col-md-4"> 
 
        <h4 class="sub-header" id="product_type">Product Type</h4> 
 
         <form> 
 
          <div class="radio"><label><input type="radio" name="product_type" value="Laptop">Laptop</label></div> 
 
          <div class="radio"><label><input type="radio" name="product_type" value="Tower">Tower</label></div> 
 
          <div class="radio"><label><input type="radio" name="product_type" value="Minitower">Minitower</label></div> 
 
          <div class="radio"><label><input type="radio" name="product_type" value="Small Form Factor">Small Form Factor</label></div> 
 
         </form> 
 
        </div><!-- /.col-lg-4 Product Type--> 
 
        
 
       <div class="text-center" id="test"> 
 
       <button target="_blank" 
 
        class="btn btn-primary "> 
 
        Test 
 
       </button> 
 
       </div>

+0

それを指摘してくれてありがとうございました。私のために働く! –

+0

@weijielinハッピーコーディング:D – TheMiddleMan

1

あなたの条件チェックはfalseを返すことはありませんので、それはですので、常に何も選択されていない場合でも、PRODUCT_TYPEの値を割り当てています。代わりにあなたが持っているチェックのため、これを使用する:正しくあなたがチェックし、製品の種類を持っていることを確認するためにチェックします

if ($('input[name="product_type"]:checked').length>0){ ... } 

+0

それはあまりにもwoks。ありがとうございます。 –

関連する問題