jQuery UI Widgets Forums Grid Validation inside row details form

This topic contains 5 replies, has 2 voices, and was last updated by  Dimitar 9 years, 10 months ago.

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
  • Validation inside row details form #57178

    susanthcv
    Participant

    I am implementing a grid with row details. I have many input elements (text-box, dropdownlist, checkbox) inside each row. All these elements are enclosed inside form tag using jQuery wrap. Now I need to perform validation on all the elements which are inside row details.

    var initrowdetails = function (index, parentElement, gridElement, datarecord) {
    var tabsdiv = null;
    var information = null;
    tabsdiv = $($(parentElement).children()[0]);
    if (tabsdiv != null) {
    information = tabsdiv.find(‘.information’);
    var container = $(‘<div style=”margin: 5px;”></div>’);
    container.appendTo($(information));
    container.wrap(“<form id=’id”+datarecord.id+”‘></form>”);

    I tried creating jqxvalidator inside initrowdetails and it didn’t work.

    $(“#id”+datarecord.id).jqxValidator({
    rules : [ {
    input : ‘.id’,
    message : ‘id is required!’,
    action : ‘change’,
    rule : ‘required’
    }, ]
    });

    Looking for a better suggestion to implement validation on form elements inside rowdetails.

    Thanks,
    Susanth

    Validation inside row details form #57191

    Dimitar
    Participant

    Hello Susanth,

    Please try it this way:

    var initrowdetails = function (index, parentElement, gridElement, datarecord) {
            var tabsdiv = null;
            var information = null;
            tabsdiv = $($(parentElement).children()[0]);
            if (tabsdiv != null) {
                information = tabsdiv.find('.information');
                var container = $(' < div style = "margin: 5px;" > < /div>');
                container.appendTo($(information));
                var form = $("<form id='id" + datarecord.id + "'></form >");
                container.wrap(form);
    
                form.jqxValidator({
                    rules: [{
                        input: '.id',
                        message: 'id is required!',
                        action: 'change',
                        rule: 'required'
                    }, ]
                });

    Best Regards,
    Dimitar

    jQWidgets team
    http://www.jqwidgets.com/

    Validation inside row details form #57311

    susanthcv
    Participant

    Thanks for responding to my query Dimitar. This issue is resolved after moving the jqxValidator to the end of initrowdetails method.

    I got another issue. Validation hint position is fixed on scroll, it is not moving along with the field inside rowdetails.

    Validation inside row details form #57321

    Dimitar
    Participant

    Hi susanthcv,

    Please try setting the validator’s hintType property to “label”.

    Best Regards,
    Dimitar

    jQWidgets team
    http://www.jqwidgets.com/

    Validation inside row details form #58021

    susanthcv
    Participant

    Hi Dimitar,

    I prefer having popup instead of label. Is there a way to disable the vertical scrollbar inside the grid with rowdetails when validator returns false ?

    Thanks,
    Susanth

    Validation inside row details form #58030

    Dimitar
    Participant

    Hi Susanth,

    Disabling the scrollbar of a grid is not possible. Vertical scrollbar is not shown when paging is enabled, however.

    Best Regards,
    Dimitar

    jQWidgets team
    http://www.jqwidgets.com/

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

You must be logged in to reply to this topic.