2016-11-24 7 views
-2

OutBrain APIの機能をチェックするために、いくつかの小さなmvc asp.netプロジェクトをビルドします。Javascript onClick関数が動作しません

私はMarketerI IDを取得し、(サーバーから)彼の名前を返すべきである入力タイプのテキストを作った。しかし、私はボタンを押しても何も起こらないと私は本当に何の手がかりを持っていないとwhouldいくつかの助けを得るためにうれしい!

おかげ

私のコード:コードもあり

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
<script src="~/Scripts/outBrain.js"></script> 
@{ 
    ViewBag.Title = "Home Page"; 
} 
<br /> 
<div class="details"> 
    <label>Enter Marketer ID</label> 
    <input type="text" class="form-control" id="marketerID"> 
    <input type="button" class="btn btn-default" value="OK" id="buttonB" /> 
    <section class="details"> 
     <div class="name"> 
      <label>Name</label> 
      <label id="nameMarketer"></label> 
     </div> 
    </section> 
</div> 

outBrain.js(スクリプトファイルのパスを含める)

$("#buttonB").on('click', function() { 
    getMarketer(); 
}); 


function getMarketer() { 
    $.ajax({ 
     url: "/home/GetOutBrainMarketers", 
     data: { id: $("marketerID").val() }, 
     success: function (result) { 
      var marketer = JSON.parse(result); 
      document.getElementById("nameMarketer").innerHTML = (marketer.name); 
     } 
    }); 
} 

CSHTMLファイルをファイルそれを追加するにはポイントが表示されません。

+0

私にとってはうまくありますか? https://jsfiddle.net/mqLtw4s0/ – Liam

+0

あなたは[デバッグ]しましたか(http://stackoverflow.com/questions/988363/how-can-i-debug-my-javascript-code)? – Liam

+0

@Liamはい彼です。無名関数にclickイベントを配置してみてください。 – bilpor

答えて

2

試してみてください。

$("#buttonB").click(function() { 
    getMarketer(); 
}); 
+1

これは有効な答えかもしれませんが、コードが何をし、どのように機能するかを説明することによって、他の人を助ける可能性が非常に高くなります。コードのみの回答は、それほど肯定的な注意を払わず、他の回答ほど有用ではありません。 – Aurora0001

+1

これは役に立つアドバイスです。ありがとうございます。 – Bushido

2

ajaxのセレクタに#がありません。 $("marketerID").val()$("#marketerID").val();

これが問題になるのでしょうか?

1

変更このコードは、このことによって

$.ajax({ 
     url: "/home/GetOutBrainMarketers", 
     data: { id: $("marketerID").val() }, 
     success: function (result) { 
      var marketer = JSON.parse(result); 
      document.getElementById("nameMarketer").innerHTML = (marketer.name); 
     } 
    }); 

$.ajax({ 
     url: "/home/GetOutBrainMarketers", 
     data: { id: $("marketerID").val() }, 
     success: function (result) { 
      var marketer = JSON.parse(result); 
      $("#nameMarketer").html(marketer.name); 
     } 
    }); 

と幸運

0
I think, you have to put the your js files at the end, so it wwil be like this: 


@{ 
    ViewBag.Title = "Home Page"; 
} 
<br /> 
<div class="details"> 
    <label>Enter Marketer ID</label> 
    <input type="text" class="form-control" id="marketerID"> 
    <input type="button" class="btn btn-default" value="OK" id="buttonB" /> 
    <section class="details"> 
     <div class="name"> 
      <label>Name</label> 
      <label id="nameMarketer"></label> 
     </div> 
    </section> 
</div> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
<script src="~/Scripts/outBrain.js"></script> 

@sectionを使うことをお勧めします。そうすれば、あなたのコードはより整理されます。

関連する問題