jQWidgets Forums

Forum Replies Created

Viewing 15 posts - 1 through 15 (of 36 total)
  • Author
    Posts

  • Narendra
    Participant

    Thank you.. It’s working fine..


    Narendra
    Participant

    Hi,

    I tried that it’s working. I set properties to those columns as sortable: false, filterable: false. but when I

    clicked on the column one drop down is appearing with options “sort ascending”, “sort descending”, “remove sort” and those

    are all in disabled mode. I don’t want to display those also..

    Give me quick reply..

    Thanks in advance..


    Narendra
    Participant

    Hi Peter,

    Thanks for your quick reply..

    I found that there is no such property (placeHolder) for jqxDropdownList in the version which we have already purchased.

    And now If I replaced these all New version in my project, may be the UI will change and functionality will be distrub.

    What I have to do now..

    Please give me suggestion..


    Narendra
    Participant

    Hi Thank for your quick reply,

    I am using jquery-1.6.min.js, But in the above example you used the jquery-1.10.2.min.js, But in the past

    we purchased license for [jqwidgets-ver2.6.0] and we are using those controls in our project, and now that placeHolder

    property is not working for jqxdropdownlist. What I have to do now..

    Please Give me Quick reply..

    Thanks in advance…


    Narendra
    Participant

    place Holder is not working for me..

    in reply to: Regarding Image Gallery Regarding Image Gallery #32801

    Narendra
    Participant

    I want to show only list of images from a folder..


    Narendra
    Participant

    No, It’s not working.. Can try to tell with code..


    Narendra
    Participant

    hi
    How I can check a jqxtree parent element on pageload…….

    how can i achieve it?


    Narendra
    Participant

    I want to check the parent element in the jqxtree which is placed in the popup when i click on the edit button of grid row

    i have 9 rows in grid suppose

    1 abc Edit Here abc have its own childs

    2 bcd Edit

    3 cde Edit

    4 def Edit

    5 efg Edit

    6 fgh Edit

    7 ghi Edit

    8 hij Edit

    9 ijk Edit

    like these all are having their childs

    Suppose when i click on 2nd edit button a popup will display with

    –> 2
    –> bcd
    –> jqxtree contains all 9 records with their childrens and having checkboxes in it.

    now my requirement is that the 2nd parent will be checked on particular edit row clicked.

    I hope you will understand
    Thank u


    Narendra
    Participant

    Thanks for giving reply But it doesn’t work for me
    I am sending code please check it once give me reply as early as possible

    <asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
    <asp:HiddenField ID="hdnapplist" runat ="server" />
    <asp:HiddenField ID="hdnpagelist" runat ="server" />
    <asp:HiddenField ID="hdnapporder" runat ="server" />
    <asp:HiddenField ID="hdndisplayname" runat="server" />
    <asp:HiddenField ID="hdnAOrder" runat ="server" />
    <asp:HiddenField ID="hdnDName" runat="server" />
    <asp:HiddenField ID="Hdnappid" runat ="server" />
    <asp:HiddenField ID="Hdndeleteid" runat="server" />
    <asp:HiddenField ID="Hdneditid" runat="server" />
    <script type ="text/javascript" >
    $(document).ready(function () {
    $("#btnAddApp").click(function () {
    $("#txtAOrder").val('');
    $("#txtDName").val('');
    $("#jqxAppPageListadd").jqxTree('uncheckAll');
    $("#popupadd").jqxWindow('show');
    });
    //Save Click
    $("#btnSave").click(function (event) {
    var aorder = document.getElementById("txtAOrder").value;
    var dname = document.getElementById("txtDName").value;
    if (aorder == "") {
    return false;
    }
    else if (dname == "") {
    return false;
    }
    document.getElementById("ContentPlaceHolder1_hdnAOrder").value = aorder;
    // alert(document.getElementById("ContentPlaceHolder1_hdnAOrder").value);
    document.getElementById("ContentPlaceHolder1_hdnDName").value = dname;
    // alert(document.getElementById("ContentPlaceHolder1_hdnADesc").value);
    $("#popupadd").jqxWindow('hide');
    $("#frm_aftermaster").submit();
    });
    });
    </script>
    <script type ="text/javascript" >
    $(document).ready(function () {
    var data = document.getElementById("ContentPlaceHolder1_hdnpagelist").value;
    // prepare the data
    var source =
    {
    datatype: "json",
    datafields: [
    { name: 'App_Id' },
    { name: 'Child' },
    { name: 'Display_Name' }
    ],
    id: 'Page_ID',
    localdata: data
    };
    // create data adapter.
    var dataAdapter = new $.jqx.dataAdapter(source);
    // perform Data Binding.
    dataAdapter.dataBind();
    var records = dataAdapter.getRecordsHierarchy('App_Id', 'Child', 'items', [{ name: 'Display_Name', map: 'label' }, { name: 'App_Id', map: 'value' }]);
    var theme = getTheme();
    $('#jqxAppPageList').jqxTree({ hasThreeStates: true, checkboxes: true, source: records, width: '180px', theme: theme });
    $('#jqxAppPageListadd').jqxTree({ hasThreeStates: true, checkboxes: true, source: records, width: '180px', theme: theme });
    var items = $('#jqxAppPageList').jqxTree('getItems');
    var firstLevelItems = new Array();
    for (var i = 0; i < items.length; i++) {
    if (items[i].level == 0) {
    firstLevelItems.push(items[i]);
    };
    };
    var theme = getTheme();
    $("#popupedit").jqxWindow({ width: 400, resizable: true, theme: 'maroon', isModal: true, cancelButton: $("#Cancel"), autoOpen: false, modalOpacity: 0.5 });
    $("#Cancel").jqxButton({ theme: 'maroon' });
    $("#btnupdate").jqxButton({ theme: 'maroon' });
    $("#popupadd").jqxWindow({ width: 400, resizable: true, theme: 'maroon', isModal: true, cancelButton: $("#addCancel"), autoOpen: false, modalOpacity: 0.5 });
    $("#addCancel").jqxButton({ theme: 'maroon' });
    $("#btnSave").jqxButton({ theme: 'maroon' });
    $("#popupdelete").jqxWindow({ width: 300, resizable: true, theme: 'maroon', isModal: true, cancelButton: $("#btnno"), autoOpen: false, modalOpacity: 0.5 });
    $("#btnno").jqxButton({ theme: 'maroon' });
    $("#btndelete").jqxButton({ theme: 'maroon' });
    var data = document.getElementById("ContentPlaceHolder1_hdnapplist").value;
    var source =
    {
    localdata: data,
    datatype: "json",
    datafields:
    [
    { name: 'Record_ID', type: 'number' },
    { name: 'App_ID', type: 'number' },
    { name: 'App_Order', type: 'string' },
    { name: 'Display_Name', type: 'string' }
    ],
    id: 'Record_ID',
    deleterow: function (rowid, commit) {
    commit(true);
    },
    updaterow: function (rowid, rowdata, commit) {
    commit(true);
    }
    };
    var dataAdapter = new $.jqx.dataAdapter(source);
    var editrow = -1;
    var cellsrenderer = function (row, column, value) {
    return '<div style="text-align: center; margin-top: 5px;">' + value + '</div>';
    }
    var columnrenderer = function (value) {
    return '<div style="text-align: center; margin-top: 5px;">' + value + '</div>';
    }
    // initialize jqxGrid
    $("#jqxappgrid").jqxGrid(
    {
    width: 470,
    height: 300,
    source: dataAdapter,
    theme: theme,
    columnsresize: true,
    columns: [
    { text: 'Record_ID', datafield: 'Record_ID', width: 120, hidden: true, renderer: columnrenderer },
    { text: 'App_ID', datafield: 'App_ID', width: 120, hidden: true, renderer: columnrenderer },
    { text: 'Application Order', datafield: 'App_Order', width: 120, align: 'center', cellsalign: 'center', renderer: columnrenderer, },
    { text: 'Display Name', datafield: 'Display_Name', width: 170, renderer: columnrenderer },
    {
    text: 'Edit', datafield: 'Edit', columntype: 'button', width: 90, renderer: columnrenderer, cellsrenderer: function () {
    return "Edit";
    }, buttonclick: function (row) {
    // open the popup window when the user clicks a button.
    // $("#frm_aftermaster").submit();
    editrow = row;
    var offset = $("#jqxappgrid").offset();
    $("#popupedit").jqxWindow({ position: { x: parseInt(offset.left) + 40, y: parseInt(offset.top) + 20 } });
    // get the clicked row's data and initialize the input fields.
    var dataRecord = $("#jqxappgrid").jqxGrid('getrowdata', editrow);
    var appid = dataRecord.App_ID;
    document.getElementById("ContentPlaceHolder1_Hdnappid").value = appid;
    // alert(appid);
    $("#txtapporder").val(dataRecord.App_Order);
    var name = dataRecord.Display_Name;
    $("#txtdisplayname").val(dataRecord.Display_Name);
    // $("#jqxAppPageList").jqxTree('uncheckAll');
    $("#jqxAppPageList").jqxTree('checkItem', firstLevelItems[editrow], true);
    // show the popup window.
    $("#popupedit").jqxWindow('show');
    }
    },
    {
    text: 'Delete', datafield: 'Delete', columntype: 'button', width: 90, renderer: columnrenderer, cellsrenderer: function () {
    return "Delete";
    }, buttonclick: function (rowindex) {
    // open the popup window when the user clicks a button.
    deleterow = rowindex;
    var offset = $("#jqxappgrid").offset();
    $("#popupdelete").jqxWindow({ position: { x: parseInt(offset.left) + 100, y: parseInt(offset.top) + 90 } });
    // show the popup window.
    $("#popupdelete").jqxWindow('show');
    // delete row.
    $("#btndelete").click(function () {
    var dataRecord = $("#jqxappgrid").jqxGrid('getrowdata', deleterow);
    var id = dataRecord.Record_ID;
    document.getElementById("ContentPlaceHolder1_Hdndeleteid").value = id;
    $("#popupdelete").jqxWindow('hide');
    $("#frm_aftermaster").submit();
    });
    }
    }
    ]
    });
    // update the edited row when the user clicks the 'Save' button.
    $("#btnupdate").click(function () {
    var dataRecord = $("#jqxappgrid").jqxGrid('getrowdata', editrow);
    var id = dataRecord.Record_ID;
    document.getElementById("ContentPlaceHolder1_Hdneditid").value = id;
    var aorder = document.getElementById("txtapporder").value;
    var dname = document.getElementById("txtdisplayname").value;
    document.getElementById("ContentPlaceHolder1_hdnapporder").value = aorder;
    document.getElementById("ContentPlaceHolder1_hdndisplayname").value = dname;
    $("#popupedit").jqxWindow('hide');
    $("#frm_aftermaster").submit();
    });
    });
    </script>
    <div align="center" >
    <h1 class ="heading" >List of Applications </h1>
    <table>
    <tr>
    <td colspan="3" style ="border-radius: 10px;border: solid #CECFCE;" >
    <div id="jqxappgrid" ></div>
    </td>
    </tr>
    <tr>
    <td align ="left" >
    <br />
    <input type="button" id="btnAddApp" class ="Post" value ="Add New Application" style="height:30px; width:160px;"/>
    </td>
    </tr>
    </table>
    </div>
    <div id="popupedit" class="tblspacermv">
    <div><b>Edit Application:</b></div>
    <div style="overflow: hidden;">
    <table>
    <tr>
    <td align="left">Application Order:</td>
    <td align="left"><input id="txtapporder" /></td>
    </tr>
    <tr>
    <td align="left">Display Name:</td>
    <td align="left"><input id="txtdisplayname" /></td>
    </tr>
    <tr>
    <td align="left" valign="top">Pages:</td>
    <td align="left"> <div id='jqxAppPageList'></div></td>
    </tr>
    <tr>
    <td align="right"></td>
    <td style="padding-top: 10px;" align="right">
    <input style="margin-right: 10px; height:26px;" type="button" id="btnupdate" value="Update" /><input id="Cancel" type="button" value="Cancel" /></td>
    </tr>
    <tr><td colspan="2"></td></tr>
    </table>
    </div>
    </div>
    <div id="popupadd" class="tblspacermv">
    <div><b>Add New Application:</b></div>
    <div style="overflow: hidden;">
    <table>
    <tr>
    <td align="left">Application Order:</td>
    <td align="left"><input id="txtAOrder" /></td>
    </tr>
    <tr>
    <td align="left">Display Name:</td>
    <td align="left"><input id="txtDName" /></td>
    </tr>
    <tr>
    <td align="left" valign="top">Pages:</td>
    <td align="left"> <div id='jqxAppPageListadd'></div></td>
    </tr>
    <tr>
    <td align="right"></td>
    <td style="padding-top: 10px;" align="right">
    <input style="margin-right: 5px; height:26px;" type="button" id="btnSave" value="Save" /><input id="addCancel" type="button" value="Cancel" /></td>
    </tr>
    <tr><td colspan="2"></td></tr>
    </table>
    </div>
    </div>
    <div id="popupdelete" class="tblspacermv">
    <div>Delete</div>
    <div style="overflow: hidden;" align="center">
    <table style="padding-left:70px">
    <tr><td></td></tr>
    <tr>
    <td align="center"><b>Are You Confirm to delete?</b></td>
    </tr>
    <tr><td></td></tr>
    <tr>
    <td style="padding-top: 10px;" align="center">
    <input style="margin-right: 20px;" type="button" id="btndelete" value="Yes" />
    <input id="btnno" type="button" value="No" /></td>
    </tr>
    </table>
    </div>
    </div>
    <div style="height: 90px"></div>
    </asp:Content>

    Thanks in advance..!


    Narendra
    Participant

    I have completely done my side but it’s only the problem to set selected value for dropdown when popup opens a value should be selected already…………..

    How?


    Narendra
    Participant

    Even though it is not working….!!!

    Any alternate or efficient way?

    please help me its very urgent to me…


    Narendra
    Participant

    I am sending code check it once and give reply please………………

     <script type="text/javascript">
    $(document).ready(function () {
    var theme = getTheme();
    var data = document.getElementById("ContentPlaceHolder1_hdnUserList").value;
    var source =
    {
    localdata: data,
    datatype: "json",
    datafields:
    [
    { name: 'Rec_Id', type: 'number' },
    { name: 'Client_FirstName', type: 'string' },
    { name: 'Client_LastName', type: 'string' },
    { name: 'Client_Email', type: 'string' },
    { name: 'Client_Status', type: 'string' },
    { name: 'Role_Name', type: 'string' },
    { name: 'Client_Mobile', type: 'string' }
    ],
    id: 'Rec_Id',
    deleterow: function (rowid, commit) {
    commit(true);
    },
    updaterow: function (rowid, rowdata, commit) {
    commit(true);
    }
    };
    var dataAdapter = new $.jqx.dataAdapter(source);
    var editrow = -1;
    var cellsrenderer = function (row, column, value) {
    return '<div style="text-align: center; margin-top: 5px;">' + value + '</div>';
    }
    var columnrenderer = function (value) {
    return '<div style="text-align: center; margin-top: 5px;">' + value + '</div>';
    }
    // initialize jqxGrid
    $("#jqxusersgrid").jqxGrid(
    {
    width: 890,
    source: dataAdapter,
    theme: theme,
    pageable: true,
    columnsresize: true,
    autoheight: true,
    enableanimations: false,
    sortable: true,
    // virtualmode: true,
    columns: [
    { text: 'Rec_Id', datafield: 'Rec_Id', hidden: true, width: 120, renderer: columnrenderer },
    { text: 'First Name', datafield: 'Client_FirstName', width: 120, renderer: columnrenderer },
    { text: 'Last Name', datafield: 'Client_LastName', width: 100, renderer: columnrenderer },
    { text: 'Email', datafield: 'Client_Email', width: 170, renderer: columnrenderer },
    { text: 'Status', datafield: 'Client_Status', width: 80, renderer: columnrenderer, cellsrenderer: cellsrenderer },
    { text: 'Role', datafield: 'Role_Name', width: 100, renderer: columnrenderer, cellsrenderer: cellsrenderer },
    { text: 'Mobile', datafield: 'Client_Mobile', width: 120, renderer: columnrenderer },
    {
    text: 'Edit', datafield: 'Edit', columntype: 'button', width: 90, renderer: columnrenderer, cellsrenderer: function () {
    return "Edit";
    }, buttonclick: function (row) {
    // open the popup window when the user clicks a button.
    editrow = row;
    var offset = $("#jqxusersgrid").offset();
    $("#popupedit").jqxWindow({ position: { x: parseInt(offset.left) + 290, y: parseInt(offset.top) +60 } });
    // get the clicked row's data and initialize the input fields.
    var dataRecord = $("#jqxusersgrid").jqxGrid('getrowdata', editrow);
    $("#txtClient_FirstName").val(dataRecord.Client_FirstName);
    $("#txtClient_LastName").val(dataRecord.Client_LastName);
    $("#txtClient_Email").val(dataRecord.Client_Email);
    $("#txtClient_Email").attr('readonly', true);
    $("#txtClient_Status").val(dataRecord.Client_Status);
    var role = dataRecord.Role_Name;
    // alert(role);
    // $("#jqxClient_Role").jqxdropdownlist('val', role);
    $("#txtClient_Mobile").val(dataRecord.Client_Mobile);
    // show the popup window.
    $("#popupedit").jqxWindow('show');
    }
    },
    {
    text: 'Delete', datafield: 'Delete', columntype: 'button', width: 90, renderer: columnrenderer, cellsrenderer: function () {
    return "Delete";
    }, buttonclick: function (rowindex) {
    // open the popup window when the user clicks a button.
    deleterow = rowindex;
    var offset = $("#jqxusersgrid").offset();
    $("#popupdelete").jqxWindow({ position: { x: parseInt(offset.left) + 290, y: parseInt(offset.top) + 60 } });
    // show the popup window.
    $("#popupdelete").jqxWindow('show');
    // delete row.
    $("#btndelete").click(function () {
    //alert();
    var dataRecord = $("#jqxusersgrid").jqxGrid('getrowdata', deleterow);
    var id = dataRecord.Rec_Id;
    document.getElementById("ContentPlaceHolder1_hdndeleteid").value = id;
    $("#popupdelete").jqxWindow('hide');
    $("#frm_aftermaster").submit();
    });
    }
    }
    ]
    });
    // update the edited row when the user clicks the 'Save' button.
    $("#btnupdate").click(function () {
    var dataRecord = $("#jqxusersgrid").jqxGrid('getrowdata', editrow);
    // alert(dataRecord);
    var id = dataRecord.Rec_Id;
    // alert(id);
    document.getElementById("ContentPlaceHolder1_hdneditid").value = id;
    // alert(document.getElementById("ContentPlaceHolder1_hdneditid").value);
    var fname = $("#txtClient_FirstName").val();
    var lname = $("#txtClient_LastName").val();
    var email = $("#txtClient_Email").val();
    var stats = $("#txtClient_Status").val();
    var item = $("#jqxClient_Role1").jqxDropDownList('getSelectedItem');
    var role = item.value;
    //alert(role);
    var mobile = $("#txtClient_Mobile").val();
    document.getElementById("ContentPlaceHolder1_HdnECFName").value = fname;
    document.getElementById("ContentPlaceHolder1_HdnECLName").value = lname;
    document.getElementById("ContentPlaceHolder1_HdnECMail").value = email;
    document.getElementById("ContentPlaceHolder1_HdnEStatus").value = stats;
    document.getElementById("ContentPlaceHolder1_HdnERole").value = role;
    document.getElementById("ContentPlaceHolder1_HdnEMobile").value = mobile;
    $("#popupedit").jqxWindow('hide');
    $("#frm_aftermaster").submit();
    });
    });
    </script>
    <div id="popupedit" class="tblspacermv">
    <div>Edit User:</div>
    <div style="overflow: hidden;">
    <table>
    <tr>
    <td align="left">First Name:</td>
    <%--<td align="left"><input id="txtUserName" /></td>--%>
    <td align="left">
    <input id="txtClient_FirstName" /></td>
    </tr>
    <tr>
    <td align="left">Last Name:</td>
    <td align="left">
    <input id="txtClient_LastName" /></td>
    </tr>
    <tr>
    <td align="left">Email:</td>
    <td align="left">
    <input id="txtClient_Email" /></td>
    </tr>
    <tr>
    <td align="left">Status:</td>
    <td align="left">
    <input id="txtClient_Status" /></td>
    </tr>
    <tr>
    <td align="left">Role:</td>
    <td align="left">
    <div id="jqxClient_Role1"></div>
    </td>
    </tr>
    <tr>
    <td align="left">Mobile:</td>
    <td align="left">
    <input id="txtClient_Mobile" /></td>
    </tr>
    <tr>
    <td align="right"></td>
    <td style="padding-top: 10px;" align="right">
    <input type="button" value="Update" id="btnupdate" style="margin-right: 5px;" /><input id="Cancel" type="button" value="Cancel" /></td>
    </tr>
    <tr>
    <td colspan="2"></td>
    </tr>
    </table>
    </div>
    </div>
    <div align="center">
    <h1 class="heading">List of Users </h1>
    <table>
    <tr>
    <td colspan="3" style="border-radius: 10px; border: solid #CECFCE;">
    <div id="jqxusersgrid"></div>
    </td>
    </tr>
    </table>
    </div>

    Narendra
    Participant

    Hi it’s not working

    I am showing a grid with edit column when i click on particular row edit button, a popupwindow will be displayed with row values, in that popup I placed one jqxgropdownlist and when i click on edit button of grid row the particular row value will be set defaultly as selected value of that dropdownlist………

    I thought that You could understood my requirement……….!

    That is my requirement plz help me as soon as possible

    thanks in advance……….!


    Narendra
    Participant

    Thanks

    Its working…..!

Viewing 15 posts - 1 through 15 (of 36 total)