У меня есть сетка кендо с 6 командовыми кнопками на каждой строке, со структурой ниже, но вызывающей разные функции. Я ищу способ передачи данных до функции, на основе которой нажата кнопка. Сейчас у меня есть 6 функций на стороне java и 6 всплывающих окон на стороне aspx. Я даже не уверен, что это можно сделать, но это всего лишь дублированный код. Здесь структура команд для каждой кнопки:
command: [{
name: "Edit",
title: "Alert Email",
width: "180px",
click: onDataBound75
}],
Это одна из 6 функций:
function onDataBound75(e) {
e.preventDefault();
$("#txtAlert").kendoEditor({
resizable: {
content: true,
toolbar: true,
encoded: false
}
});
var window = $("#emailAlert_popup").kendoWindow({
width: "600px",
visible: false,
modal: true,
actions: [
"Maximize",
"Close"
],
});
var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
var viewModelAlert75 = kendo.observable({
Alert75EmailSubject: dataItem.Alert75EmailSubject,
Alert75EmailBody: dataItem.Alert75EmailBody,
Alert75FromAddress: dataItem.Alert75FromAddress,
});
kendo.bind($("#emailAlert_popup"), viewModelAlert75);
window.data("kendoWindow").center().open();
};
И вот одно из 6 всплывающих окон для стороны aspx:
<div id="emailAlert_popup" class="TT_PopupWindow">
<div class="SearchParam">
<label class="control-label" for="txtAlert75EmailSubject" style="width:200px">Email Subject</label>
<input name="txtEmailSubject" id="txtAlert75EmailSubject" class="k-textbox" style="width:430px"
data-bind="value: Alert75EmailSubject" />
</div>
<div class="SearchParam">
<label class="control-label" for="txtAlert75EmailBody" style="width:200px">Email Body</label>
<textarea id="txtAlert" rows="10" cols="30" style="height:440px" aria-label="editor" data-bind="value: Alert75EmailBody"></textarea>
</div>
<div class="SearchParam">
<label class="control-label" for="txtAlert75FromAddress" style="width:200px">From Address</label>
<input name="txtFromAddress" id="txtAlert75FromAddress" class="k-textbox" style="width:430px"
data-bind="value: Alert75FromAddress"
/>
</div>
<div class="k-edit-buttons k-state-default">
<button type="button" id="btnAlert75EmailUpdate" data-role="button" class="k-button k-button-icontext k-primary k-grid-update" role="button" aria-disabled="false" tabindex="0" style="float:right"><span class="k-icon k-i-check"></span>Update</button>
<button type="button" id="btnAlert75Cancel" data-role="button" class="k-button k-button-icontext k-grid-cancel" role="button" aria-disabled="false" tabindex="1" style="float:right"><span class="k-icon k-i-cancel"></span>Cancel</button>
</div>
</div>
Есть ли способ иметь только одну функцию javascript, передающую данные на стороне aspx и только 1 всплывающее окно на странице aspx?
Я понял, как это сделать, для тех, кто ищет тот же сценарий. Так я достиг этого с 1 функцией и 1 kendowindow:
command: [{
name: "Alert75Edit",
title: "Alert Email",
width: "180px",
click: AlertEmails
}],
Источник данных:
DataSources = {
EditorWindow:{
EmailSubject:null,
EmailBody:null,
EmailFromAddress:null
}
};
Одиночная функция:
function (e) {
e.preventDefault();
var AlertType = e.data.commandName.replace("Edit", "");
if (!$("#txtAlertEmailBody").data("kendoEditor")) {
$("#txtAlertEmailBody").kendoEditor({
resizable: {
content: true,
toolbar: true,
encoded: false
}
});
}
var window = $("#emailAlert_popup").kendoWindow({
width: "600px",
visible: false,
modal: true,
actions: [
"Maximize",
"Close"
],
});
var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
EditorWindow.EmailSubject = dataItem[AlertType + "EmailSubject"];
EditorWindow.EmailBody = dataItem[AlertType + "EmailBody"];
EditorWindow.EmailFromAddress = dataItem[AlertType + "FromAddress"];
var viewModelAlert = kendo.observable({
AlertEmailSubject: EditorWindow.EmailSubject,
AlertEmailBody: EditorWindow.EmailBody,
AlertFromAddress: EditorWindow.EmailFromAddress,
});
kendo.bind($("#emailAlert_popup"), viewModelAlert);
window.data("kendoWindow").center().open();
};
Единственное всплывающее окно kendoWindow в файле aspx:
<div id="emailAlert_popup" class="TT_PopupWindow">
<div class="SearchParam">
<label class="control-label" for="txtAlertEmailSubject" style="width:200px">Email Subject</label>
<input name="txtEmailSubject" id="txtAlertEmailSubject" class="k-textbox" style="width:430px"
data-bind="value: AlertEmailSubject" />
</div>
<div class="SearchParam">
<label class="control-label" for="txtAlertEmailBody" style="width:200px">Email Body</label>
<textarea id="txtAlertEmailBody" rows="10" cols="30" style="height:440px" aria-label="editor" data-bind="value: AlertEmailBody"></textarea>
</div>
<div class="SearchParam">
<label class="control-label" for="txtAlertFromAddress" style="width:100px">From Address</label>
<input name="txtFromAddress" id="txtAlertFromAddress" class="k-textbox" style="width:430px"
data-bind="value: AlertFromAddress"
/>
</div>
<div class="k-edit-buttons k-state-default">
<button type="button" id="btnAlertCancel" data-role="button" class="k-button k-button-icontext k-grid-cancel" role="button" aria-disabled="false" tabindex="1" style="float:right; margin:5px"><span class="k-icon k-i-cancel"></span>Cancel</button>
<button type="button" id="btnAlertEmailUpdate" data-role="button" class="k-button k-button-icontext k-primary k-grid-update" role="button" aria-disabled="false" tabindex="0" style="float:right; margin:5px"><span class="k-icon k-i-check"></span>Update</button>
</div>
</div>
EmailAddress
EmailSubject
иEmailBody
зависимости от того, какая кнопка нажата. Мне нужно отправить эти 3 поля данных в функцию и всплывающее окно.