javascript - 单击按钮时无法将数据发送到其他页面？

Question

您好，我正在 sharepoint 中开发一个 asp.net javascript 应用程序。有 2 页。第一页是default.aspx。我有一个带有编辑按钮的 GridView 。每当我单击编辑按钮时，我想重定向到 addnewitem.aspx 页面。每当我单击编辑时，我想将查询字符串中的当前行数据发送到 addnewitem.aspx。我正在尝试如下。但我的页面正在刷新，并且没有重定向到 addnewitem.aspx

下面是我的 gridview 代码。我正在获取数据。

function readAll() {
    var clientContext;
    clientContext = SP.ClientContext.get_current();
    var oList = clientContext.get_web().get_lists().getByTitle('Requisition');
    var query = new SP.CamlQuery();
    query.set_viewXml('<View><RowLimit></RowLimit>10</View>');
    var items = oList.getItems(query);
    clientContext.load(oList);
    clientContext.load(items);
    var table = $("#addtable");
    var innerHtml = "<tr><th>ID</th><th>Title</th><th>PrimarySkills</th><th>SecondarySkills</th><th>Vacanies</th><th>JobSummary</th><th>JobDescription</th><th>Experience_x0028_Yrs_x0029_</th><th>Qualification</th><th>m</th><th>Customer</th><th>RecievedDate</th><th>TargetDate</th><th>Comments1</th><th>Division</th><th>Actions</th></tr>";
    clientContext.executeQueryAsync(
        Function.createDelegate(this, function () {
        var itemInfo = '';
        var enumerator = items.getEnumerator();
        while (enumerator.moveNext()) {
           var currentListItem = enumerator.get_current();
           innerHtml += "<tr><td>" + currentListItem.get_item('ID') + "</td><td>" + currentListItem.get_item('Title') + "</td><td>" + currentListItem.get_item('PrimarySkills') + "</td><td>" + currentListItem.get_item('SecondarySkills') +"</td><td scope='col'><button class='btn btn-primary btn-cons blue' id='Edit'>Edit</button></td></tr>";

        }
        table.html(innerHtml);
   }),
   Function.createDelegate(this, fail)
   );
   function success() {
       $("#dvMessage").text("Operation Completed Successfully");
   }

   function fail() {
       $("#dvMessage").text("Operation failed  " + arguments[1].get_message());
   }
}

在上面的代码中，我的“编辑”按钮重新加载。我想重定向到其他页面。这并没有发生。文档.location.href = url;这是正确的重定向方式吗？

这是我的编辑按钮代码。

$('#addtable td:nth-child(4)').bind('click', function () {
    alert("Clicked");
    var Title = $(this).closest("tr").children().eq(0).html();
    var PrimarySkills = $(this).closest("tr").children().eq(1).html();
    var SecondarySkills = $(this).closest("tr").children().eq(2).html();

    var url = 'http://sites/APPSTEST/JobRequisitionApp/Pages/AddNewItem.aspx?Title=' + encodeURIComponent(Title) + 'PrimarySkills=' + encodeURIComponent(PrimarySkills) + 'SecondarySkills=' + encodeURIComponent(SecondarySkills);
    document.location.href = url;
});

有人可以指导我实现这一目标吗？谢谢大家。

Answer 1

您的问题是您单击 button在行上，但您的绑定(bind)/处理程序违反 td

<button class='btn btn-primary btn-cons blue' id='Edit'>Edit</button>

默认情况下，没有类型的按钮与 <button type='submit'.. 相同因此，每次您单击该按钮时，它都会提交您的表单(所有 SharePoint 页面都包含该表单)，从而您可以获得回发/刷新。

一个简单的选择是删除 <button> html 构建的一部分并替换为一些纯文本，即 <td>edit</td>这应该会触发你的绑定(bind)。然而，这并不是很简洁。

将按钮更改为按钮

<button type='button' class='btn btn-primary btn-cons blue' id='Edit'>Edit</button>

并更改处理程序以在按钮上触发:

$('#addtable td:nth-child(5) button').bind(

注意:第 n 个子级应该是 5，因为第 5 列是带有按钮的列

你也可以return false将其更改为在按钮上触发后从处理程序中更改为 type=button处理这个问题并阻止它提交。