jQWidgets Forums
jQuery UI Widgets › Forums › Dialogs and Notifications › Window › function is called twice › Reply To: function is called twice
Hi cpuin,
1) If you want to re-open addDialog with empty fields you should clear their content when click on button with id “cancelButton”. Here is an example how to achieve it for the first input field:
$("#cancelButton").mousedown(function () {
// close jqxWindow.
$("#addDialog").jqxWindow('close');
$('#invCompany').val('');
});2) In the following example there is not such an issue.
<!DOCTYPE html>
<html lang="en">
<head>
<title></title>
<link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" />
<link rel="stylesheet" href="../../jqwidgets/styles/jqx.summer.css" type="text/css" />
<script type="text/javascript" src="../../scripts/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script>
<script type="text/javascript" src="../../jqwidgets/jqxwindow.js"></script>
<script type="text/javascript" src="../../../jqwidgets/jqxdatetimeinput.js"></script>
<script type="text/javascript" src="../../../jqwidgets/jqxcalendar.js"></script>
<script type="text/javascript" src="../../../jqwidgets/globalization/globalize.js"></script>
<script type="text/javascript" src="../../jqwidgets/jqxbuttons.js"></script>
<script type="text/javascript" src="../../../jqwidgets/jqxinput.js"></script>
<script type="text/javascript" src="../../../jqwidgets/jqxdata.js"></script>
<script type="text/javascript" src="../../../jqwidgets/jqxdropdownlist.js"></script>
<script type="text/javascript" src="../../../jqwidgets/jqxlistbox.js"></script>
<script type="text/javascript" src="../../../jqwidgets/jqxdatatable.js"></script>
<script type="text/javascript" src="../../../jqwidgets/jqxscrollbar.js"></script>
<script type="text/javascript" src="../../../jqwidgets/jqxdata.export.js"></script>
<script type="text/javascript">
// SAVE INVOICE --------------------------------------------------------------------------------------
function saveInvoice(rowData) {
var data = "insert=true&" + $.param(rowData);
$.ajax({
dataType: 'json',
url: "../sampledata/beverages.txt",
cache: false,
data: data,
success: function (data, status, xhr) {
//command is executed
$("#addDialog").jqxWindow('close');
//create confirmation modal dialog
$('#eventWindow').jqxWindow({
maxHeight: 150, maxWidth: 280, minHeight: 30, minWidth: 250, height: 145, width: 270,
resizable: false, isModal: true, modalOpacity: 0.3,
okButton: $('#ok'), cancelButton: $('#cancel'),
initContent: function () {
$('#ok').jqxButton({ width: '65px' });
$('#cancel').jqxButton({ width: '65px' });
$('#ok').focus();
}
});
$("#eventWindow").jqxWindow('open');
$("#eventWindow").css('visibility', 'inherit');
$("#ok").mousedown(function () {
$("#eventWindow").jqxWindow('close');
//print PDF
var saleNumber = $("#invAcct").val();
var url = "invoiceen.php?saleNumber=" + saleNumber;
var url= "../sampledata/beverages.txt" + saleNumber;
});
},
error: function (jqXHR, textStatus, errorThrown) {
//command has failed on execution
alert(errorThrown);
}
});
}
// CREATE TABLE ------------------------------------------------------------------------------------
function createTable() {
var source =
{
datatype: "json",
datafields: [
{ name: 'ID', type: 'int' },
{ name: 'Acct', type: 'int' },
{ name: 'PartnerID', type: 'string' },
{ name: 'ObjectID', type: 'string' },
{ name: 'Date', type: 'string' }
],
url: url,
cache: false,
addRow: function (rowID, rowData, position, commit) {
var data = "insert=true&" + $.param(rowData);
$.ajax({
dataType: 'json',
url: "../sampledata/beverages.txt",
cache: false,
data: data,
success: function (data, status, xhr) {
// update command is executed.
commit(true);
},
error: function (jqXHR, textStatus, errorThrown) {
commit(false);
alert(errorThrown);
}
});
},
updateRow: function (rowID, rowData, commit) {
var data = "" + $.param(rowData);
$.ajax({
dataType: 'json',
url: '',
cache: false,
data: data,
success: function (data, status, xhr) {
// update command is executed.
commit(true);
},
error: function (jqXHR, textStatus, errorThrown) {
commit(false);
alert('Does not work :( ');
}
});
},
deleteRow: function (rowID, commit) {
// synchronize with the server - send delete command
// call commit with parameter true if the synchronization with the server is successful
// and with parameter false if the synchronization failed.
commit(true);
}
};
var dataAdapter = new $.jqx.dataAdapter(source);
$("#dataTable").jqxDataTable(
{
width: 750,
pageable: true,
pagerButtonsCount: 10,
source: dataAdapter,
sortable: true,
columnsResize: false,
altRows: true,
showAggregates: false,
aggregatesHeight: 60,
columns: [
{ text: 'Продажба', dataField: 'Acct', width: 100 },
{ text: 'Обект:', dataField: 'ObjectID', cellsFormat: 'f', width: 150 },
{ text: 'Партньор:', dataField: 'PartnerID', width: 250 },
{ text: 'Дата:', dataField: 'Date', width: 150 }
]
});
}
// END CREATE TABLE ----------------------------------------------------------------------------------
//END-----------------------------------------------------------------------------------------------
$(document).ready(function () {
$("#startDate").jqxDateTimeInput({ width: '100px', height: '25px', formatString: "yyyy-MM-dd" });
$("#endDate").jqxDateTimeInput({ width: '100px', height: '25px', formatString: "yyyy-MM-dd" });
$("#submitButton").jqxButton({ width: '100px', height: '25px' });
$("#submitButton").mousedown(function () {
var start = $('#startDate').val();
var end = $('#endDate').val();
//check which arguments are selected
url = "../sampledata/beverages.txt?salesforinvoice=true&" + "startDate=" + start + "&endDate=" + end;
createTable();
});
$("#excelExport").jqxButton();
$("#xmlExport").jqxButton();
$("#csvExport").jqxButton();
$("#tsvExport").jqxButton();
$("#htmlExport").jqxButton();
$("#jsonExport").jqxButton();
$("#excelExport").click(function () {
$("#dataTable").jqxDataTable('exportData', 'xls');
});
$("#xmlExport").click(function () {
$("#dataTable").jqxDataTable('exportData', 'xml');
});
$("#csvExport").click(function () {
$("#dataTable").jqxDataTable('exportData', 'csv');
});
$("#tsvExport").click(function () {
$("#dataTable").jqxDataTable('exportData', 'tsv');
});
$("#htmlExport").click(function () {
$("#dataTable").jqxDataTable('exportData', 'html');
});
$("#jsonExport").click(function () {
$("#dataTable").jqxDataTable('exportData', 'json');
});
$("#printButton").jqxButton({ width: 80 });
$("#printButton").click(function () {
var gridContent = $("#dataTable").jqxDataTable('exportData', 'html');
var newWindow = window.open('', '', 'width=800, height=500'),
document = newWindow.document.open(),
pageContent =
'<!DOCTYPE html>' +
'<html>' +
'<head>' +
'<meta charset="utf-8" />' +
'<title>jQWidgets DataTable</title>' +
'</head>' +
'<body>' + gridContent + '</body></html>';
document.write(pageContent);
document.close();
newWindow.print();
});
//ADD DIALOG -----------------------------------------------------------------------------------------
$("#addDialog").jqxWindow({
resizable: true,
isModal: true,
position: { left: $("#dataTable").offset().left + 400, top: $("#dataTable").offset().top + 35 },
width: 500, height: 360,
autoOpen: false
});
$("#invCompany").jqxInput({ height: 25, width: 350, minLength: 1 });
$("#invDate").jqxDateTimeInput({ width: '100px', height: '25px', formatString: "yyyy-MM-dd" });
$("#invAcct").jqxInput({ height: 25, width: 350, minLength: 1 });
$("#invRecipient").jqxInput({ height: 25, width: 350, minLength: 1 });
$("#invIDCard").jqxInput({ height: 25, width: 350, minLength: 1 });
$("#invPublisher").jqxInput({ height: 25, width: 350, minLength: 1 });
var payments = [
{ id: 1, title: "В брой" },
{ id: 2, title: "По банков път" },
{ id: 3, title: "С карта" },
{ id: 4, title: "С ваучер" }
];
var source =
{
localdata: payments,
datatype: 'array',
datafields: [
{ name: 'id' },
{ name: 'title' }
]
};
var dataAdapter = new $.jqx.dataAdapter(source);
$("#invPayment").jqxDropDownList({ source: dataAdapter, selectedIndex: 0, displayMember: "title", valueMember: "id", width: '150', height: '25' });
$("#invOsnovanie").jqxInput({ height: 25, width: 350, minLength: 1 });
$("#invOpisanie").jqxInput({ height: 25, width: 350, minLength: 1 });
$("#cancelButton").jqxButton({ height: 25, width: 80 });
$("#cancelButton").mousedown(function () {
// close jqxWindow.
$("#addDialog").jqxWindow('close');
$('#invCompany').val('');
});
$("#saveButton").jqxButton({ height: 25, width: 80 });
$("#saveButton").mousedown(function () {
// update edited row.
var row = parseInt($("#addDialog").attr('data-row'));
var rowData = {
Acct: $("#invAcct").val(),
Date: $("#invDate").val(),
Recipient: $("#invRecipient").val(),
IDCard: $("#invIDCard").val(),
Publisher: $("#invPublisher").val(),
Payment: $("#invPayment").val(),
Osnovanie: $("#invOsnovanie").val(),
Opisanie: $("#invOpisanie").val()
};
saveInvoice(rowData);
});
$("#addDialog").css('visibility', 'inherit');
$("#addDialog").on('close', function () {
// enable jqxDataTable.
$("#dataTable").jqxDataTable({ disabled: false });
});
$("#dataTable").on('rowDoubleClick', function (event) {
var args = event.args;
var index = args.index;
var row = args.row;
// update the widgets inside jqxWindow.
$("#addDialog").jqxWindow('setTitle', "Издаване на фактура към продажба номер: " + row.Acct);
$("#addDialog").jqxWindow('open');
$("#addDialog").attr('data-row', index);
$("#dataTable").jqxDataTable({ disabled: true });
$("#invAcct").val(row.Acct);
$("#invCompany").val(row.PartnerID);
$("#invDate").val(row.Date);
$("#invAcct").val(row.Acct);
});
});
</script>
</head>
<body>
<div style='margin-top: 20px;'>
<div style='float: left;' id="startDate" type="date" name="startdate"></div>
<div style='float: left;' id="endDate" type="date" name="endDate" />
</div>
<input type="button" value="Изпрати" id='submitButton' />
<br />
<div id="dataTable"></div>
<div style='margin-top: 20px;'>
<div style='float: left;'>
<input type="button" value="Export to Excel" id='excelExport' />
<br />
<br />
<input type="button" value="Export to XML" id='xmlExport' />
</div>
<div style='margin-left: 10px; float: left;'>
<input type="button" value="Export to CSV" id='csvExport' />
<br />
<br />
<input type="button" value="Export to TSV" id='tsvExport' />
</div>
<div style='margin-left: 10px; float: left;'>
<input type="button" value="Export to HTML" id='htmlExport' />
<br />
<br />
<input type="button" value="Export to JSON" id='jsonExport' />
</div>
</div>
<div style='margin-top: 20px;'>
<div style='margin-left: 10px; float: left;'>
<input type="button" value="Print" id='printButton' />
</div>
</div>
<div style="visibility: hidden;" id="addDialog">
<div></div>
<div style="overflow: hidden;">
<table>
<tr>
<td>Партньор:</td>
<td>
<input type="text" id='invCompany' name='invCompany' /></td>
</tr>
<tr>
<td>Дата:</td>
<td>
<div id="invDate" type="date" name="invDate"></div>
<input id="invAcct" type="number" name="invAcct" hidden="false" /></td>
</tr>
<tr>
<td>Получател:</td>
<td>
<input id="invRecipient" type="text" name="invRecipient" value="" /></td>
</tr>
<tr>
<td>ЕГН/Лична карта:</td>
<td>
<input id="invIDCard" type="text" name="invRecipient" value="" /></td>
</tr>
<tr>
<td>Издал документа:</td>
<td>
<input id="invPublisher" type="text" name="invRecipient" value="" /></td>
</tr>
<tr>
<td colspan="2">
<br>
</td>
</tr>
<tr>
<td>Начин на плащане:</td>
<td>
<div id="invPayment"></div>
</td>
</tr>
<tr>
<td>Основание:</td>
<td>
<input id="invOsnovanie" type="text" name="invRecipient" value="" /></td>
</tr>
<tr>
<td>Описание:</td>
<td>
<input id="invOpisanie" type="text" name="invRecipient" value="" /></td>
</tr>
<tr>
<td colspan="2">
<br>
</td>
</tr>
<tr>
<td></td>
<td>
<button id="saveButton">Запази</button>
<button style="margin-left: 5px;" id="cancelButton">Откажи</button></td>
</tr>
</table>
</div>
</div>
<div id="eventWindow" style="visibility: hidden;">
<div></div>
<div>
Фактурата е запазена!<br>
Искате ли да генерирате PDF?
<div style="float: right; margin-top: 15px;">
<button id="ok" style="margin-right: 10px">Да</button>
<input type="button" id="cancel" value="Отказ" />
</div>
</div>
</div>
</body>
</html>Best Regards,
Nadezhda
jQWidgets team
http://www.jqwidgets.com/