Forum Replies Created

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

  • robrichard
    Member

    This is what I came up with for a temporary fix:

            if ($(window).width() < 1600) {
    $('#jqxMenu2').jqxMenu({rtl : true});
    }
    else {
    $('#jqxMenu2').jqxMenu({rtl : false});
    }
    in reply to: jqxvalidator in jqxWindow jqxvalidator in jqxWindow #25670

    robrichard
    Member

    Can you give an example of this? I don’t follow…


    robrichard
    Member

    In addition to the above, even if in the second case it works, but there are additional validation tooltips out of view, they will also show up floating “outside” of the window.


    robrichard
    Member

    COMPLETELY UNACCEPTABLE!!!

    A user does not want to have their entire page taken up by a grid and scroll. This is a SEVERE oversight!


    robrichard
    Member

    I think we’re not on the same page with this question. Let’s say I have a grid with 100 records in it, but the page size is 25. Currently, when a grouping occurs manually on a page, it shows only 25 items inside of the group. I would like it to pull all 100 and then group them. How can this be done?

    in reply to: jqx combobox validator jqx combobox validator #25273

    robrichard
    Member

    Ugh – on a whim I decided to remove the first rule, and wouldn’t you know it, it works. The trick is to use ONLY the function. Ummm, why not just modify the validator code to accommodate this very common scenario instead of requiring the developers to jump through hoops?

    in reply to: jqx combobox validator jqx combobox validator #25272

    robrichard
    Member

    Is it for sure that this works? I implemented the same sort of code, and when I manually type something in the combobox, it says that it is still required. I tried this using both 2.8.3 and 2.9.3

    Here are my rules:

    { input: '#Vendor', message: 'A vendor is required - please select or enter a vendor', action: 'keyup, blur', rule: 'required' },
    { input: '#Vendor', message: 'A vendor is required - please select or enter a vendor', action: 'select', rule: function(input){if($("#Vendor").jqxComboBox('val') == "") {alert("false"); return false;} else {alert("true"); return true};} }

    Here is the combobox definition:

    $("#Vendor").jqxComboBox({source: dataAdapter1, displayMember: "Vendor", valueMember: "Vendor", width: 200, height: 25, theme: 'orion', searchMode: 'containsignorecase', autoComplete: true });

    And here is the html:

    <div id="Vendor" class="text" />
    in reply to: Custom regex Custom regex #22350

    robrichard
    Member

    That’s not very practical, sorry. For those of you who stumble upon this, here is how I handle validating a US zip code entry.

    1. Change the jqxMaskedInput to just a jqxInput.
    2. In your validator, add a custom function to capture the values and validate it (I used a regex that checks for either a 5 digit zip code or the zip plus 4):

                       {
    input: '#zipcode', message: 'A five digit zip code (11111) or five digit zip plus 4 (11111-1111) is for a zip code', action: 'keyup, blur', rule:
    function (input) {
    var zippattern = /^\d{5}([\-]?\d{4})?$/;
    return (zippattern.test(input.val())==true);
    }
    },
    in reply to: Custom regex Custom regex #22306

    robrichard
    Member

    Where is setRegex in the documentation??? I wanted to set a zipcode mask to use either the US 5 digit zip code or the US zip plus 4, and setRegex seems like it would do the trick. Is there a way to apply it to the entire input element rather than to each character?


    robrichard
    Member

    I would also REALLY like to see this enhancement. It really is useless to bind to an index – the index of a selected value may change over time; the value itself will remain constant.


    robrichard
    Member

    I’m also curious if we can use jqxscrollbars for this instead of the native scroll bar.


    robrichard
    Member

    Well that response doesn’t inspire much confidence. It appears that setting the maxlength property of the underlying HTML input tag accomplishes this (appears to work in latest versions of chrome, firefox and IE).

    So in your HTML:

    <input id="MiddleInitial" name="MiddleInitial" class="text" type="text" maxlength="1" />

    Then in your js:

    $("#MiddleInitial").jqxInput({ width: '150px', height: '25px' });

    robrichard
    Member

    Still not working (not updating the grid with latest data)… Something happened between 2.6 and 2.8 (I am now using 2.8.3). Here is the code to build the grid:

    // prepare the data
    var gridsource = {
    datatype: “json”,
    datafields: [
    { name: ‘addressId’ },
    { name: ‘address1’ },
    { name: ‘city’ },
    { name: ‘state’ },
    { name: ‘zipcode’ },
    { name: ‘municipality’ },
    { name: ‘name’ },
    { name: ‘femaname’ },
    { name: ‘damage’ }
    ],
    url: ‘@Url.Action(“IncidentAddresses”)’ + “?IncidentID=” + incidentID
    };

    var dataAdapter = new $.jqx.dataAdapter(gridsource);

    var settings = {
    width: $(“#jqxExpanderGrid”).width() – 4,
    source: dataAdapter,
    autoheight: true,
    groupable: true,
    autoshowloadelement: false,
    showdefaultloadelement: false,
    pageable: true,
    pagesize: 25,
    pagesizeoptions: [25, 50, 100, 200, 500],
    sortable: true,
    theme: ‘orion’,
    columns: [
    { text: ”, datafield: ‘addressId’, width: 78,
    cellsrenderer: function (row, colum, value) {
    var cell = ‘View / Edit‘;
    cell += ‘Delete‘;
    cell += ‘Property Report‘;
    return cell;
    }
    },
    { text: ‘Address 1’, datafield: ‘address1’, width: 200 },
    { text: ‘City’, datafield: ‘city’, width: 150 },
    { text: ‘Municipality’, datafield: ‘municipality’, width: 150 },
    { text: ‘State’, datafield: ‘state’, width: 50 },
    { text: ‘Zip’, datafield: ‘zipcode’, width: 80 },
    { text: ‘Structure Type’, datafield: ‘name’, width: 150},
    { text: ‘Damage Level’, datafield: ‘femaname’, width: 130 },
    { text: ‘Damage Values’, datafield: ‘damage’, width: 100, cellsformat: ‘c0’, cellsalign: ‘right’, align: ‘right’ }
    ],
    autoshowfiltericon: true
    };

    $(“#jqxgrid”).jqxGrid(settings);

    $(“#expand”).jqxButton({});
    $(“#collapse”).jqxButton({});
    $(“#expandall”).jqxButton({});
    $(“#collapseall”).jqxButton({});

    $(“#jqxgrid”).bind(“pagechanged”, function (event) {
    $(“#eventslog”).css(‘display’, ‘block’);
    if ($(“#events”).find(‘.logged’).length >= 5) {
    $(“#events”).jqxPanel(‘clearcontent’);
    }
    var args = event.args;
    var eventData = “pagechanged

    Page:” + args.pagenum + “, Page Size: ” + args.pagesize + “

    “;
    $(‘#events’).jqxPanel(‘prepend’, ‘

    ‘ + eventData + ‘

    ‘);
    // get page information.
    var paginginformation = $(“#jqxgrid”).jqxGrid(‘getpaginginformation’);
    $(‘#paginginfo’).html(“

    Page:” + paginginformation.pagenum + “, Page Size: ” + paginginformation.pagesize + “, Pages Count: ” + paginginformation.pagescount);
    });
    $(“#jqxgrid”).bind(“pagesizechanged”, function (event) {
    $(“#eventslog”).css(‘display’, ‘block’);
    $(“#events”).jqxPanel(‘clearcontent’);
    var args = event.args;
    var eventData = “pagesizechanged

    Page:” + args.pagenum + “, Page Size: ” + args.pagesize + “, Old Page Size: ” + args.oldpagesize + “

    “;
    $(‘#events’).jqxPanel(‘prepend’, ‘

    ‘ + eventData + ‘

    ‘);
    // get page information.
    var paginginformation = $(“#jqxgrid”).jqxGrid(‘getpaginginformation’);
    $(‘#paginginfo’).html(“

    Page:” + paginginformation.pagenum + “, Page Size: ” + paginginformation.pagesize + “, Pages Count: ” + paginginformation.pagescount);
    });

    // expand group.
    $(“#expand”).bind(‘click’, function () {
    var groupnum = parseInt($(“#groupnum”).val());
    if (!isNaN(groupnum)) {
    $(“#jqxgrid”).jqxGrid(‘expandgroup’, groupnum);
    }
    });
    // collapse group.
    $(“#collapse”).bind(‘click’, function () {
    var groupnum = parseInt($(“#groupnum”).val());
    if (!isNaN(groupnum)) {
    $(“#jqxgrid”).jqxGrid(‘collapsegroup’, groupnum);
    }
    });
    // expand all groups.
    $(“#expandall”).bind(‘click’, function () {
    $(“#jqxgrid”).jqxGrid(‘expandallgroups’);
    });
    // collapse all groups.
    $(“#collapseall”).bind(‘click’, function () {
    $(“#jqxgrid”).jqxGrid(‘collapseallgroups’);
    });
    // trigger expand and collapse events.
    $(“#jqxgrid”).bind(‘groupexpand’, function (event) {
    var args = event.args;
    $(“#expandedgroup”).html(“Group: ” + args.group + “, Level: ” + args.level);
    });
    $(“#jqxgrid”).bind(‘groupcollapse’, function (event) {
    var args = event.args;
    $(“#collapsedgroup”).html(“Group: ” + args.group + “, Level: ” + args.level);
    });

    And then to “refresh” the grid, I use:

    $(“#jqxGrid”).jqxGrid(‘updatebounddata’, ‘cells’);

    It does nothing. The old data is still presented in the grid.


    robrichard
    Member

    Ah, got it… Wrap each section inside of the splitters with a blank DIV. That would have been a more appropriate error message…


    robrichard
    Member

    SkippingAdi:

    What did you do to fix this issue???

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