2016-07-05 4 views
0

javascriptを使用してダイナミックテーブルを作成すると、アンカーリンクが機能しません。アンカータグがダイナミックテーブルで動作しない

コード:

  $(".genareteEmail").click(
        function() { 
         alert("sdsds"); 
         var incidentNo = $(this).attr('dataId'); 

         $.ajax({ 
          url : "generate?incident=" + incidentNo, 
          method : 'GET', 
          success : function(data) { 
           var subject = data; 
           var content = subject.split("END"); 
           try { 

            var outlookApp = new ActiveXObject(
              "Outlook.Application"); 
            var nameSpace = outlookApp 
              .getNameSpace("MAPI"); 
            mailFolder = nameSpace 
              .getDefaultFolder(6); 
            mailItem = mailFolder.Items 
              .add('IPM.Note.FormA'); 
            mailItem.Subject = content[3]; 
            mailItem.cc = content[2]; 
            mailItem.To = content[1]; 
            mailItem.HTMLBody += content[0]; 
            var insp = mailItem.GetInspector; 
            var mySigline = mailItem.HTMLBody; 
            mailItem.display(0); 
           } catch (e) { 
            alert(e); 
            // act on any error that you get 
           } 
          } 
         }); 

        }); 

      $("#btnSubmit").click(function(){ 
       callMe(); 

       }); 

      function callMe() { 
       $.ajax({ 
        url : "ajaxTicketInfo", 
        type : 'GET', 
        error : function() { 

        }, 
        success : function(result) { 
         var ticketCount = result.length; 

         var mytable = $('<table></table>');//.attr({ id: "basicTable" }); 
         var rows = ticketCount; 
         var cols = 2; 
         var tr = []; 
        $('<tr></tr>').html("<th>Incidents</th><th>Mail Generation</th>").appendTo(mytable); 
         for (var i = 0; i < rows; i++) { 
          var row = $('<tr></tr>').appendTo(mytable); 
          for (var j = 0; j < cols; j++) { 
           if(j== 0){ 
           $('<td></td>').text(result[i] + " "+ Math.random()).appendTo(row); 
           }else{ 

            //var aTag = $('<a></a>').attr({ dataId: result[i] }); 

            $('<td></td>').html('<a class="genareteEmail" href="#" dataId ="'+result[i]+'">Generate Email</a>').appendTo(row); 
            /* $('<td></td>').text("Generate Mail").append(row); */ 

           } 

          } 

         } 
         $("#box").html(mytable); 
        }, 
        cache: false 
       }); 
      }; 

      setInterval(callMe, 900000); 
     }); 



<body> 


<h1>Acknowledgement Mail Generation</h1> 

<div> 
    <div> 
     Next Refresh will be in <span id="time">05:00</span> minutes! 
    </div> 
    <div> 
     <button id = "btnSubmit">Refresh</button> 
    </div> 
</div> 

HTMLコード:私のコードを1として

<div id="box"> 
    <table> 
    <tbody> 
     <tr><th>Incidents</th><th>Mail Generation</th></tr> 
     <tr><td>INC000013610276 0.15926314527814805</td><td> 
     <a class="generateEmail" href="#" dataid="INC000013610276">Generate 
      Email</a></td></tr> 
     <tr><td>INC000013608353 0.7894190043310691</td><td> 
     <a class="generateEmail" href="#" dataid="INC000013608353">Generate 
      Email</a></td></tr> 
     <tr><td>INC000013594620 0.8572899023472066</td><td> 
     <a class="generateEmail" href="#" dataid="INC000013594620">Generate 
      Email</a></td></tr> 
     <tr><td>INC000013592053 0.02202170976246076</td><td> 
     <a class="generateEmail" href="#" dataid="INC000013592053">Generate Email</a> 
     </td> 
    </tr> 
    </tbody> 
</table> 
</div> 

私は.genarateEmailのjqueryのを実行する必要が対応するアンカーリンクをクリックしたとき。しかし、クリック機能は機能していません。

ダイナミックテーブルを作成している間にどこに間違っていたのか誰でも助けてくれますか?

+0

htmlには実際に 'class =" genareteEmail "'がありますか?または 'class = 'generateEmail''をタイプミスなく使用していますか? –

+0

ご迷惑をおかけして申し訳ありませんが、私はHTML部分を編集しましたが、まだ問題に直面しています。 – bharathi

+0

ここで/ jsコードを実行していますか?それが '$ .ready()'ブロックにない場合、またはhtmlが解析される前に実行されている場合は、そのcssクラスがまだDOMに存在しないため、何も付けません。 –

答えて

0

文書が準備できたら、すべてのイベントをバインドする必要があります。したがって、あなたのメソッドを文書の中に@マークBのコメントとして準備しておいてください。

$(document).ready(function(){ 
    $(".genareteEmail").click(function(){ 
     //Your logic 

    }) 
}) 
関連する問題