This topic contains 3 replies, has 2 voices, and was last updated by Hristo 8 years, 10 months ago.
-
Dear all,
I have used jqxTab control for my screen and one tab element, I added jqxGrid, and also I used three URL parameters to get values from my main form. My problem is when i used the URL with the parameters, my tab control will not display. If I use URL without parameters, tab works perfectly. Please help me to resolve this problem.Example URL
http://localhost/cms/cl_mastersettings.php?varid=1&ite=10.06920141936767954&let=00.06920141936767954 —-> TAB WILL NOT DISPLAYhttp://localhost/cms/cl_mastersettings.php —-> TAB AND OTHER CONTROLS WORK PERFECTLY.
Thank you,
NalakaHerewith I attached my source code
<!DOCTYPE html>
<html lang=”en”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
<title id=’Description’>Master Settings</title><link rel=”stylesheet” href=”jq/jqwidgets/styles/jqx.base.css” type=”text/css” />
<script type=”text/javascript” src=”jq/scripts/jquery-1.11.1.min.js”></script>
<script type=”text/javascript” src=”jq/jqwidgets/jqxcore.js”></script>
<script type=”text/javascript” src=”jq/jqwidgets/jqxdata.js”></script>
<script type=”text/javascript” src=”jq/jqwidgets/jqxbuttons.js”></script>
<script type=”text/javascript” src=”jq/jqwidgets/jqxscrollbar.js”></script>
<script type=”text/javascript” src=”jq/jqwidgets/jqxlistbox.js”></script>
<script type=”text/javascript” src=”jq/jqwidgets/jqxdropdownlist.js”></script>
<script type=”text/javascript” src=”jq/jqwidgets/jqxmenu.js”></script>
<script type=”text/javascript” src=”jq/jqwidgets/jqxgrid.js”></script>
<script type=”text/javascript” src=”jq/jqwidgets/jqxgrid.pager.js”></script>
<script type=”text/javascript” src=”jq/jqwidgets/jqxgrid.sort.js”></script>
<script type=”text/javascript” src=”jq/jqwidgets/jqxgrid.filter.js”></script>
<script type=”text/javascript” src=”jq/jqwidgets/jqxgrid.grouping.js”></script>
<script type=”text/javascript” src=”jq/jqwidgets/jqxgrid.storage.js”></script>
<script type=”text/javascript” src=”jq/jqwidgets/jqxgrid.columnsresize.js”></script>
<script type=”text/javascript” src=”jq/jqwidgets/jqxgrid.edit.js”></script>
<script type=”text/javascript” src=”jq/jqwidgets/jqxgrid.columnsreorder.js”></script>
<script type=”text/javascript” src=”jq/jqwidgets/jqxgrid.selection.js”></script>
<script type=”text/javascript” src=”jq/jqwidgets/jqxexpander.js”></script>
<script type=”text/javascript” src=”jq/jqwidgets/jqxpanel.js”></script>
<script type=”text/javascript” src=”jq/jqwidgets/jqxcheckbox.js”></script>
<script type=”text/javascript” src=”jq/scripts/demos.js”></script>
<script type=”text/javascript” src=”jq/jqwidgets/jqxdata.export.js”></script>
<script type=”text/javascript” src=”jq/jqwidgets/jqxgrid.export.js”></script>
<script type=”text/javascript” src=”jq/jqwidgets/jqxgrid.sort.js”></script>
<script type=”text/javascript” src=”jq/scripts/generatedata.js”></script>
<script type=”text/javascript” src=”jq/jqwidgets/jqxdragdrop.js”></script>
<script type=”text/javascript” src=”jq/jqwidgets/jqxlistbox.js”></script>
<script type=”text/javascript” src=”jq/jqwidgets/jqxdropdownlist.js”></script>
<script type=”text/javascript” src=”jq/jqwidgets/jqxtabs.js”></script>
<script type=”text/javascript” src=”jq/jqwidgets/jqxcalendar.js”></script>
<script type=”text/javascript” src=”jq/jqwidgets/jqxnumberinput.js”></script>
<script type=”text/javascript” src=”jq/jqwidgets/jqxdatetimeinput.js”></script>
<script type=”text/javascript” src=”jq/jqwidgets/globalization/globalize.js”></script>
<script type=”text/javascript” src=”jq/jqwidgets/jqxcombobox.js”></script><script type=”text/javascript”>
var celpos=0;$(document).ready(function () {
// Create a jqxMenu
$(“#jqxMenu”).jqxMenu({ width: 700, height: 30, showTopLevelArrows: true, keyboardNavigation: true });
$(“#jqxMenu”).on(‘itemclick’, function (event)
{
$(“#log”).html(“Clicked: ” + $(event.args).text());var str = $(event.args).text();
if (str.trim()==”New”)
{
//location.reload();
window.location=”cl_equipment_users.php?varid=”+varid+”&ite=”+wright+”&let=”+dright;
gModify=0;
}
else if (str.trim()==”Save”)
{
SaveData();
//set timeout function to get delay for complete updatetable function
setTimeout(function()
{
window.location=”cl_equipment_users.php?varid=”+varid+”&ite=”+wright+”&let=”+dright;
}, delay);
}
else if (str.trim()==”Close”)
{
window.location=”mysqlmenu.php?varid=”+varid;
}});
$(“#jqxMenu”).css(‘visibility’, ‘visible’);
$(“#jqxMenu”).jqxMenu(‘focus’);var initTab1 = function ()
{
var categorylist =
{
datatype: “json”,
datafields:
[
{ name: ‘catcode’, type: ‘number’ },
{ name: ‘catname’, type: ‘string’ }
],
url: “svr_categorylist.php”,
async: false};
var dataAdaptercategory = new $.jqx.dataAdapter(categorylist);var maillist =
{
datatype: “json”,addrow: function (rowid, rowdata, position, commit) {
// synchronize with the server – send insert command
// call commit with parameter true if the synchronization with the server is successful
//and with parameter false if the synchronization failed.
// you can pass additional argument to the commit callback which represents the new ID if it is generated from a DB.
commit(true);
},
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);
},
updaterow: function (rowid, rowdata, commit)
{
// synchronize with the server – send update command
// call commit with parameter true if the synchronization with the server is successful
// and with parameter false if the synchronization failder.
commit(true);
},
datafields:
[
{ name: ‘catname’, value: ‘catcode’, values: { source: dataAdaptercategory.records, value: ‘catcode’, name: ‘catname’ } },
{ name: ‘catcode’, type: ‘number’ },
{ name: ’email’, type: ‘string’ },
{ name: ‘active’,type: ‘bool’ }
],
type: ‘POST’,
url: “svr_mastermail_list.php”,};
var dataAdaptermaillist = new $.jqx.dataAdapter(maillist);
$(“#jqxgridmaillist”).jqxGrid(
{
width: ‘100%’,
height: ‘84%’,
source: dataAdaptermaillist,
editable: true,
enabletooltips: true,
//selectionmode: ‘multiplecellsadvanced’,
showtoolbar: true,
rendertoolbar: function (toolbar) {
var me = this;
var container = $(“<div style=’margin: 5px;’></div>”);
toolbar.append(container);
container.append(‘<input id=”addrowbutton” type=”button” value=”Add New Row” />’);
container.append(‘<input style=”margin-left: 5px;” id=”deleterowbutton” type=”button” value=”Delete Selected Row” />’);
$(“#addrowbutton”).jqxButton();
$(“#deleterowbutton”).jqxButton();// create new row.
$(“#addrowbutton”).on(‘click’, function () {
var commit = $(“#jqxgridmaillist”).jqxGrid(‘addrow’, null, {});
});// delete row.
$(“#deleterowbutton”).on(‘click’, function () {
var selectedrowindex = $(“#jqxgridmaillist”).jqxGrid(‘getselectedrowindex’);
var rowscount = $(“#jqxgridmaillist”).jqxGrid(‘getdatainformation’).rowscount;
alert(rowscount);
if (selectedrowindex >= 0 && selectedrowindex < rowscount) {
var id = $(“#jqxgridmaillist”).jqxGrid(‘getrowid’, selectedrowindex);
var commit = $(“#jqxgridmaillist”).jqxGrid(‘deleterow’, id);
}
});},
columns:
[
{
text: ‘Category Name’, datafield: ‘catcode’, displayfield: ‘catname’, columntype: ‘dropdownlist’, width: 150,createeditor: function (row, value, editor) {
editor.jqxDropDownList({ source: dataAdaptercategory, displayMember: ‘catname’, valueMember: ‘catcode’ });
},// update the editor’s value before saving it.
cellvaluechanging: function (row, column, columntype, oldvalue, newvalue) {
// return the old value, if the new value is empty.if (newvalue == “”) return oldvalue;
}},
{
text: ‘Email Address’, columntype: ‘textbox’, datafield: ‘moduleid’, width: 300, hidden: false,validation: function (cell, value) {
//alert(ValidateEmail(value));
if (ValidateEmail(value)==false)
{
return { result: false, message: “You have entered an invalid email address!” };
}
return true;
},},
{ text: ‘Active’, columntype: ‘checkbox’, datafield: ‘allow’, width: 75 },
]});
$(“#jqxgridmaillist”).on(‘cellendedit’, function (event) {
var column = $(“#jqxgridmaillist”).jqxGrid(‘getcolumn’, event.args.datafield);
var value =event.args.value.value;
var displayValue = event.args.value.label;});
}
// init widgets.
var initWidgets = function (tab) {
switch (tab) {
case 0:
initTab1();
break;
case 1:
//initChart();
break;
}
}$(‘#jqxTabs’).jqxTabs({ width: 580, position: ‘top’, collapsible: false, selectionTracker: true, animationType: ‘fade’,initTabContent: initWidgets });
});
function ValidateEmail(email)
{
var x = email;
var atpos = x.indexOf(“@”);
var dotpos = x.lastIndexOf(“.”);
if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length) {
return false;
}
}function getUrlVars()
{
var vars = {};
var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) {
vars[key] = value;
});
return vars;
}//get userid, name and code from the url
var varid = getUrlVars()[“varid”];//get rights from the url
var varD = getUrlVars()[“let”];
var dright=varD;
varD=varD.substring(0, 1);var varW = getUrlVars()[“ite”];
var wright=varW;
varW=varW.substring(0, 1);</script>
</head>
<body class=’default’><div id=’jqxWidget’>
<div id=’jqxMenu’ style=’visibility: hidden; margin-left: 5px;’>
- New
- Close
<li id=”Save”>Save
</div>
<br>
<div id=’jqxTabs’>
-
<li style=”margin-left: 30px;” >Setup main email addresses
- Setup IT Division Users
<div style=”overflow: hidden;”>
<div id=”jqxgridmaillist”></div>
<div style=”margin-top: 10px; height: 15%;”>
Setup list of email addresses to get update mails from the user’s request logs.
</div>
</div><div>
users
</div>
</div>
</div>
</body>
</html> - New
You must be logged in to reply to this topic.