Forum Replies Created

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

  • pankhi
    Participant

    the above code is not working properly.. it keeps All the navigation bars open and didnot close if I close the navigation bar


    pankhi
    Participant

    is there any way to count the number of navigation bars so that rather than defining the each bar( var expanded0 = $.jqx.cookie.cookie(“jqxNavigationBar0”);) we can do it with the help of loop?


    pankhi
    Participant

    thanks validationError works for me. 🙂


    pankhi
    Participant

    The solution given by you i working fine.. but it keeps only one navigation bar open. what if i want to open more than one navigation bar?

    in reply to: change the date into timestamp change the date into timestamp #67698

    pankhi
    Participant

    no it’s working for me? is it working for you?

    in reply to: change the date into timestamp change the date into timestamp #67650

    pankhi
    Participant

    cellsformat: ‘yyyy-MM-dd’ helps us to change the date format .
    My API returns me date like “2015-02-16 11:03:19.000000” and the cellsformat is not working for the above date.
    SO i want to convert the given date into unix date time like strtotime(‘2015-02-16 11:03:19.000000’); and than wanted to convert it into date format.

    in reply to: widget is not compatible in ie 8 widget is not compatible in ie 8 #59775

    pankhi
    Participant

    i have tried this without quotes(”) too..and still facing the same issue.


    pankhi
    Participant

    Hi i have mention it in widget too. Following is my code . i have mentioned the theme name while initializing the grid.
    FOlowwing is my code. Can you please tell where i have to mention other than while initializing the grid
    `$=jQuery.noConflict();
    $(document).ready(function(){
    //===========================
    // show the grid for inbox
    //===========================
    var url = “/messages/inboxjson”;
    // prepare the data
    var source =
    {
    datatype: “json”,
    datafields: [
    { name: ‘TimeStamp’,type: “date”},
    { name: ‘Priority’,type: “string”},
    { name: ‘Type’,type: “string” },
    { name: ‘Reason’ ,type: “string”},
    { name: ‘Subject’ ,type: “string”},
    { name: ‘HtmlBody’ ,type: “string”},
    { name: ‘id’ ,type: “int”},
    { name: ‘MessageRead’ ,type: “int”},
    ],
    id: ‘id’,
    url: url,
    pagesize: 30,
    };

    var initrowdetails = function (index, parentElement, gridElement, datarecord) {
    var tabsdiv = null;
    var detail = null;
    var title=null;
    tabsdiv = $($(parentElement).children()[0]);
    if (tabsdiv != null) {
    detail = tabsdiv.find(‘.detail’);
    title = tabsdiv.find(‘.title’);

    // if msg is unread mark the text with bold font
    if(datarecord.MessageRead==”0″){
    var container = $(‘<div style=”margin: 5px; font-weight: bold;”></div>’)
    }else{
    var container = $(‘<div style=”margin: 5px;”></div>’)
    }
    container.appendTo($(detail));

    var manageemail= $(‘<div style=”float: left; width: 20%;”></div>’);
    var leftcolumn = $(‘<div style=”float: left; width: 40%;”></div>’);
    var rightcolumn = $(‘<div style=”float: left; width: 40%;”></div>’);

    container.append(leftcolumn);
    container.append(rightcolumn);
    container.append(manageemail);

    var settings= $(“<div class=’jqx-rc-all’ style=’margin: 10px;’><b>Email Status:</b></div>”);
    var settingsmargin= $(“<div style=’margin-top: 10px;’></div>”);
    var selectbox= $(‘<select style=”width:124px !important;” class=”selectbox”><option value=”select”>Select Status</option><option value=”read” selected >Read</option><option value=”unread”>Unread</option><option value=”archived”>Archived</option></select>’);

    settingsmargin.append(selectbox);
    settingsmargin.appendTo(settings);
    manageemail.append(settings);

    var Priority = “<div style=’margin: 10px;’><b>Priority:</b> ” + datarecord.Priority + “</div>”;
    var TimeStamp = “<div style=’margin: 10px;’><b>Date:</b> ” + dataAdapter.formatDate(datarecord.TimeStamp, DateTimeFomat) + “</div>”;
    var Subject = “<div style=’margin: 10px;’><b>Subject:</b> ” + datarecord.Subject + “</div>”;
    var HtmlBody= “<div style=’margin: 10px;’>” + datarecord.HtmlBody+ “</div>”;

    $(leftcolumn).append(Priority);
    $(leftcolumn).append(TimeStamp);
    $(leftcolumn).append(Subject);
    $(leftcolumn).append(HtmlBody);

    var Type = “<div style=’margin: 10px;’><b>Type:</b> ” + datarecord.Type + “</div>”;
    var Reason = “<div style=’margin: 10px;’><b>Reason:</b> ” + datarecord.Reason + “</div>”;

    $(rightcolumn).append(Type);
    $(rightcolumn).append(Reason);

    $(tabsdiv).jqxTabs({ width: 750, height: 170});

    //===============================================
    // ajax to mark as unread for read message
    //===============================================
    $(‘.selectbox’).change(function(){
    var value = $(this).val();
    if(value != “select”){
    // if(confirm(‘Are you sure you want to ‘+ value +’ message ?’)){
    if(value == “unread”){
    //————————————
    // ajax to mark the message as unread
    //————————————
    var updateId= “id=” + datarecord.id;
    $.ajax({
    url: ‘/messages/updatereadmessagesajax’,
    data: updateId,
    type: “POST”,
    cache: false,
    async: false,
    success: function(response)
    {
    if(response==”success”){
    // window.location.href = “/messages/unreadmessages”;
    }else {
    alert(‘Something went wrong.Please try again.’);
    }
    }
    });
    }
    if(value == “read” ){
    //————————————
    // ajax to mark the message as read
    //————————————
    var messageId= “id=” + datarecord.id;
    $.ajax({
    url: ‘/messages/updatemessagesajax’,
    data: messageId,
    type: “POST”,
    cache: false,
    async: false,
    success: function(response)
    {
    if(response==”success”){
    // window.setTimeout(‘location.reload()’,5000); //reloads after 5 seconds
    }else {
    alert(‘Something went wrong.Please try again.’);
    }
    }
    });
    }
    if(value == “archived” ){
    //————————————
    // ajax to mark the message as unread
    //————————————
    var archivedId= “id=” + datarecord.id;
    $.ajax({
    url: ‘/messages/updatearchivedmessagesajax’,
    data: archivedId,
    type: “POST”,
    cache: false,
    async: false,
    success: function(response)
    {
    if(response==”success”){
    // window.location.href = “/messages/archivedmessages”;
    }else {
    alert(‘Something went wrong.Please try again.’);
    }
    }
    });
    }
    // }
    }
    });
    //———————————————————————–
    // ajax called to UPDATE the column “MessageRead” when user read message
    //———————————————————————–
    var messageId=’id=’+datarecord.id;
    $.ajax({
    url: ‘/messages/updateunreadmessagesajax’,
    data: messageId,
    type: “POST”,
    cache: false,
    async: false,
    success: function(response)
    {
    if(response==”success”){
    // window.setTimeout(‘location.reload()’,6000);
    //window.location.reload();
    }else{
    alert(‘Something went wrong please try again.’);
    }
    },
    error: function (response) {
    // cancel changes.
    alert(‘Something went wrong please try again.’);
    }

    });

    }
    }

    var dataAdapter = new $.jqx.dataAdapter(source, {
    beforeLoadComplete: function (records, originalData, c) {
    for (var i = 0; i < records.length; i++) {

    // show date if it is present in db
    if(originalData[i].TimeStamp==”0″ ){
    records[i].TimeStamp=””
    }else{
    records[i].TimeStamp= new Date(originalData[i].TimeStamp* 1000)
    }

    // add for priority acc to the no.
    if(originalData[i].Priority==”0″){
    records[i].Priority=”Important”
    }else if(originalData[i].Priority==”1″){
    records[i].Priority=”Normal”
    }else if(originalData[i].Priority==”2″){
    records[i].Priority=”Low”
    }else{
    records[i].Priority=””
    }

    };

    return records;
    },
    });

    var expandData = new Array();
    // initialize jqxGrid
    $(“#jqxgrid”).jqxGrid(
    {
    width: ‘100%’,
    theme: KiouiTheme,
    source: dataAdapter,
    filterable: true,
    showfilterrow: true,
    pageable: true,
    autoheight: true,
    sortable: true,
    altrows: true,
    enabletooltips: true,
    pagesizeoptions: [’30’, ’60’, ’90’],
    selectionmode: ‘singlerow’,
    columnsresize: true,
    rowdetails: true,
    enablebrowserselection: true,
    rowdetailstemplate: {
    rowdetails: “<div style=’margin: 10px;’><ul style=’margin-left: 30px;’><li class=’title’>Detail<div class=’detail’></div></div>”,
    rowdetailsheight: 200
    },

    ready: function () {
    var data = $(‘#jqxgrid’).jqxGrid(‘getrows’);
    for (var i = 0; i < data.length; i++) {
    expandData.push(false);
    };

    $(“#jqxgrid”).on(“rowclick”, function (event) {
    var column = event.args.column;
    var rowindex = event.args.rowindex;
    var columnindex = event.args.columnindex;
    if (expandData[rowindex] == false) {
    $(‘#jqxgrid’).jqxGrid(‘showrowdetails’, rowindex);
    } else {
    $(‘#jqxgrid’).jqxGrid(‘hiderowdetails’, rowindex);
    };
    });

    $(‘#jqxgrid’).on(‘rowexpand’, function (event) {
    var args = event.args;
    var row = args.rowindex;
    expandData[row] = true;
    });

    $(‘#jqxgrid’).on(‘rowcollapse’, function (event) {
    var args = event.args;
    var row = args.rowindex;
    expandData[row] = false;
    });

    },
    initrowdetails: initrowdetails,
    columns: [
    { text: ‘Date (PST)’, datafield: ‘TimeStamp’, type: ‘date’, cellsformat: DateTimeFomat},
    { text: ‘Priority’, datafield: ‘Priority’},
    { text: ‘Type’, datafield: ‘Type’ , cellsformat: ‘c2’},
    { text: ‘Subject’, datafield: ‘Subject’ ,cellsformat: ‘c2’},
    ],
    });

    });


    pankhi
    Participant

    waiting for reply..

    in reply to: row detail row detail #53660

    pankhi
    Participant

    thanx

    in reply to: show details show details #53461

    pankhi
    Participant

    Hi

    Its working fine when we want to open the details but if I want to close the detail than I have to click on arrow?
    can we also close the detail on click of any field too??


    pankhi
    Participant

    $(document).ready(function(){
    //===============================
    // show the grid for email Group
    //===============================
    var url = “/settings/manageemailjson”; // action from where we get the result in json
    var source =
    {
    datatype: “json”,
    datafields:
    [
    { name: ‘Name’, map:”SystemEmailgroupEmail>Name”, type: ‘string’ },
    { name: ‘Email’,map:”SystemEmailgroupEmail>Email”, type: ‘string’ },
    { name: ‘groupName’,map:”SystemEmailgroupGroup>groupName”, type: ‘string’ },
    ],
    updaterow: function (rowid, rowdata, commit) {
    // synchronize with the server – send update command
    },
    id: ‘id’,
    url: url,
    pagesize: 30,
    };
    var dataAdapter = new $.jqx.dataAdapter(source);
    var editrow = -1;

    // initialize jqxGrid
    $(“#jqxgrid”).jqxGrid(
    {
    width:’100%’,
    height: 350,
    source: dataAdapter,
    pageable: true,
    autoheight: true,
    sortable: true,
    altrows: true,
    enabletooltips: true,
    pagesizeoptions: [’10’, ’20’, ’30’,’40’],
    showfilterrow: true,
    filterable: true,
    showtoolbar: false,

    // columns shown in grid are mention below
    columns: [
    { text: ”, datafield: ‘Edit’, columntype: ‘number’,filterable: false,width :’5%’, sortable: false ,
    cellsrenderer: function () {
    return ‘<div style=”width: 100%”></div>’;
    }
    },
    { text: ‘Name’, datafield: ‘Name’ ,width :’25%’},
    { text: ‘Email’, datafield: ‘Email’ ,width :’35%’ },
    { text: ‘groupName’, datafield: ‘groupName’ ,width :’30%’},
    { text: ”, datafield: ‘Delete’, columntype: ‘number’,filterable: false, sortable: false ,width :’5%’,
    cellsrenderer: function () {
    return ‘<div></div>’;
    }
    },
    ]

    });

    // initialize the popup window and buttons.
    $(“#popupWindow”).jqxWindow({
    width: 750, height:260, resizable: false, isModal: true, autoOpen: false, cancelButton: $(“#cancel”), modalOpacity: 0.01
    });

    // update the edited row when the user clicks the ‘Save’ button.
    $(“#Save”).click(function () {

    if (editrow >= 0) {

    var rowID = $(‘#jqxgrid’).jqxGrid(‘getrowid’, editrow);
    alert(rowID);
    var row = {
    Name: $(“#Name”).val(),
    Email: $(“#Email”).val(),
    id:rowID,
    };
    // ajax called to UPDATE the row on edit

    $.ajax({
    url: ‘/settings/addemailajax’,
    data: row,
    type: “POST”,
    cache: false,
    async: false,
    success: function(response)
    {
    if(response==”success”){

    }else{
    alert(‘Something went wrong please try again.’);
    }
    },
    error: function (response) {
    // cancel changes.
    alert(‘Something went wrong please try again.’);
    }
    });

    // $(‘#jqxgrid’).jqxGrid(‘updaterow’, rowID, row);
    $(“#popupWindow”).jqxWindow(‘hide’);
    }
    });

    // on click of edit and delete
    $(“#jqxgrid”).on(“cellclick”, function (event) {
    var column = event.args.column;
    var rowindex = event.args.rowindex;
    var columnindex = event.args.columnindex;

    //when user wants to edit the record
    if (columnindex == 0) {

    // open the popup window when the user clicks a button.
    editrow = rowindex;
    var offset = $(“#jqxgrid”).offset();
    $(“#popupWindow”).jqxWindow({ position: { x: parseInt(offset.left) + 60, y: parseInt(offset.top) + 60} });
    // get the clicked row’s data and initialize the input fields.
    var dataRecord = $(“#jqxgrid”).jqxGrid(‘getrowdata’, editrow);
    $(“#groupName”).val(dataRecord.groupName);
    var rowID = $(‘#jqxgrid’).jqxGrid(‘getrowid’, editrow);
    var emailId = “id=” + rowID ;

    $.ajax({
    url: ‘/settings/selectedgroupnameajax’,
    data: emailId ,
    type: “POST”,
    cache: false,
    async: false,
    success: function(response)
    {
    }
    });
    // show the popup window.
    $(“#popupWindow”).jqxWindow(‘show’);

    };

    // if user click want to delete record
    if (columnindex == 4){
    if(confirm(‘Are you sure you want to delete this record?’)){
    deleterow = rowindex;
    var rowID = $(‘#jqxgrid’).jqxGrid(‘getrowid’, deleterow ); // fetch the deleted id
    var del = “param=delete&id=” + rowID ;
    $.ajax({
    url: ‘/settings/deleteemailajax’,
    data: del,
    type: “POST”,
    cache: false,
    async: false,
    success: function(response)
    {
    if(response==”success”){
    window.location.reload();
    }
    }
    });
    };
    };
    });

    //======================================================
    // called ajax to save the data on click of “add email”
    //=======================================================
    $(“#addRecord”).click(function (){
    $.ajax({
    url: “/settings/addemailajax”,
    type: “POST”,
    cache: false,
    async: false,
    data: $(“#addForm”).serialize(),
    success: function(response)
    {
    if(response==”success”){
    $(‘#TempForm’).jqxWindow(‘close’);
    window.location.reload();
    }
    }
    });
    $(“#addForm”).submit( function(){
    return false;
    });
    });
    });

    //==================================================================
    // window open in email group view
    //==================================================================
    var basicDemo = (function () {
    //Adding event listeners
    function _addEventListeners() {
    $(‘#addrowbutton1’).click(function () {
    $(‘#TempForm’).jqxWindow(‘open’); // to open the window onclick of open button
    });
    $(‘#hideWindowButton’).mousedown(function () {
    $(‘#TempForm’).jqxWindow(‘close’); // to close the add window onclick of cancel button
    });
    $(‘#cancel’).mousedown(function () {
    $(‘#popupWindow’).jqxWindow(‘close’); // to close the edit window onclick of cancel button
    });
    };

    //Creating all page elements which are jqxWidgets
    function _createElements() {
    $(‘#addrowbutton1′).jqxButton({ width: ’70px’ });
    };

    //Creating the window
    function _createWindow() {
    $(‘#TempForm’).jqxWindow({
    showCollapseButton: true, maxHeight: 260, maxWidth: 750, minHeight:260, minWidth: 650, height: 260, width: 750, autoOpen: false,
    initContent: function () {
    $(‘#TempForm’).jqxWindow(‘focus’);
    }
    });
    };
    return {
    config: {
    dragArea: null
    },
    init: function () {
    _createElements();
    _addEventListeners();
    _createWindow();
    }
    };
    } ());

    $(document).ready(function () {
    //Initializing the demo
    basicDemo.init();
    });

    To fetch the record from more than 1 table I am using map in datafield like:- [ { name: ‘Email’,map:”SystemEmailgroupEmail>Email”, type: ‘string’ },] and in above code var rowID = $(‘#jqxgrid’).jqxGrid(‘getrowid’, editrow); will return the id of the record we are editing(which comes from database).
    but instead it is returning the id of the row (i.e if i edit the first record it is returning “0” instead of “7”).

    but if I am fetching the result from one table and remove map from the datafield:- datafields:
    [
    { name: ‘Email’, type: ‘string’ },
    ],
    than on alert of rowID it return id “7”

    So will you please guide me that if I am fetching record from 2-3 tables than how to get the id of the record?`

Viewing 12 posts - 1 through 12 (of 12 total)