如何在表格行中生成动态按钮并在按钮上单击打开新页面

我实际上有一个要求，从服务url生成动态表，然后生成动态表。这是我工作，但我想要的是如何在表格行中生成动态按钮并在按钮上单击打开新页面

如何使用点击事件在每个表格行上生成动态按钮。
生成按钮后，我们如何分配点击事件按钮我的意思是假设在一个表中有四个列，如日期，身份证号码，名称，位置和点击每列或与该单元格相关它必须重定向到一个新页面。

或

如果一个表行被点击和有4列有喜欢日期，ID号，名称，位置点击事件具有将采取日期作为参数，然后单击事件函数，然后必须再进行下一页/重定向

$('#btn_Day').click(function() { 

var ex = document.getElementById("dpp_info"); 
var clOptions = ex.options[ex.selectedIndex].value; 
var clOptions1 = ex.options[ex.selectedIndex].text; 

var dt = todaydate; 
var dt1 = todaydate; 

$.ajax({ 
    type: 'GET', 
    url: xxxxx.xxxxx.xxxxx, 
    data: frmDate_=" + dt + "&toDate_=" + dt1 + "", 

    success: function (resp) { 

     var Location = resp; 

     var tr;   

     for (var i = 0; i < Location.length; i++) { 

      tr = tr + "<tr>"; 
      tr = tr + "<td style='height:20px' align='left'>" + Location[i].Name + "</td>"; 
      tr = tr + "<td style='height:20px' align='left'>" + Location[i].Date + "</td>"; 
      tr = tr + "<td style='height:20px' align='left'>" + Location[i].IdNum + "</td>"; 


      tr = tr + "</tr>"; 

     }; 

     document.getElementById('Wise').innerHTML = "<table class='r'>" + "<tr><thead ><th style='height:20px'>Location</th>" 
     + "<th style='height:20px'>Date</th>" + "<th style='height:20px'>Id Num</th>" + "</tr></thead>" 
     + tr + 
     "<tr></tr>" + 
     "</table>"; 
     document.getElementById('Wise').childNodes[0].nodeValue = null; 

    }, 
    error: function (e) { 

     window.plugins.toast.showLongBottom("Please Enable your Internet connection"); 

    } 
}); 
});

现在

图像中，如果你看到有四列，如果我在idnumb点击，有记录与特定数量必须显示在单独的页面

寻求帮助想！

来源

2017-07-22 Madpop

不知道我完全理解你想要做什么，但它听起来像你想添加处理日期，身份证号码，姓名和位置的小提琴。你可以添加一个类到列/行和你需要的任何其他属性，如data-name ='number'。一旦你将这个添加到dom中，你可以添加该类的处理程序？ –

@JamesDale请检查问题 – Madpop

因此，如果我点击22，它会显示IdNum为22的其他记录？ –

经过对此的更多讨论后，关键是只使用处理程序并使用属性传递任何值。你可以在这里看到

https://jsfiddle.net/p2fpbkuo/3/

$('.button-click').off(); 
$('.button-click').on('click', function() { 
    // navigate to new page 
// console.log('button click') 

// what you could do here is get the serialnumber which is an attribute on the button 
var id = $(this).attr('data-id') // as long as this is unique this should always work 

var filteredResults = results.filter(function (result) { 
    if (result.SerialNumber.toString() === id.toString()) { 
    return result; 
    } 
}); 

var selectedRowValues = filteredResults[0]; 

// this will contain all the values for that row 
console.log(selectedRowValues) 

// var dataValue = $(this).attr('data-url'); // dont't need this any more 
window.open(selectedRowValues.Url) 
});

来源

2017-07-22 16:04:19

如何在表格行中生成动态按钮并在按钮上单击打开新页面

回答

相关问题