[WildWillParticipant]

Peter,

That isn’t going to be possible. I am not a regular web developer. I am helping some others here to get this working. I don’t know how to make what I am working with into a jsfiddle demo. Too many parts for me to figure out – jquery, jqwidgets, php, web server(s)/services, etc. I don’t really know all about that stuff.

All I can tell you is that when the create user pop up window is displayed, I see the hints regardless of the type (label or not). When the edit user pop up is displayed, if the hintType: ‘label’ is set, I (somehow now?!?!) see ONLY newPassword and newPasswordVerify hints ‘Password is required!’ All other hints do not show up (for instance if I delete the user name, I don’t see the Username is required! hint). If the hintType is not set to label, then I see absolutely no hints. This is the best I can do telling you what’s wrong.

    $(".commonButton").jqxValidator({
        hintType: 'label',
        rules: [
            {input: "[name='username']", message: 'Username is required!', action: 'keyup, blur', rule: 'required'},
            {input: "[name='username']", message: 'Your username must be between 4 and 50 characters!', action: 'keyup, blur', rule: 'length=4,50'},
            {input: "[name='email']", message: 'E-mail is required!', action: 'keyup, blur', rule: 'required'},
            {input: "[name='email']", message: 'Invalid e-mail!', action: 'keyup', rule: 'email'},
            {input: "[name='display_name']", message: 'Display (Real) Name is required!', action: 'keyup, blur', rule: 'required'},
            {input: "[name='display_name']", message: 'Your real name must not contain numbers!', action: 'keyup', rule: 'notNumber'}, 
            {input: "[name='newPassword']", message: 'Password is required!', action: 'keyup, blur', rule: 'required'},
            {input: "[name='newPassword']", message: 'Your password must be between 6 and 16 characters!', action: 'keyup, blur', rule: 'length=6,16'},
            {input: "[name='newPasswordVerify']", message: 'Password is required!', action: 'keyup, blur', rule: 'required'},
            {input: "[name='newPasswordVerify']", message: 'Passwords don\'t match!', action: 'keyup, focus', rule: function (input, commit) {
                   if (input.val() === $("[name='newPassword']").val()) {
                       return true;
                   }
                   return false;
                }
           }  
        ]
    });

The only other thing I can think of is that I have to call the validator creation. It is not automatic. When the editButtonPress function is called for the edit user (see below), the first thing I do is call the function that has the validator creation.

var editCellRenderer = function (row, columnfield, value, defaulthtml, columnproperties) {  
     return '<div onclick="editButtonPress(this);" type="button" class="btnEdit userButton commonButton jqx-rc-all jqx-rc-all-darkblue jqx-button jqx-button-darkblue jqx-widget jqx-widget-darkblue jqx-fill-state-normal jqx-fill-state-normal-darkblue" id="' + row +'" value="Edit User" style="width:100%"/>'
        +'<img class="userButtonEditImg" style="width:20px; height=20px;" src="img/pencil.png"/></div>';
};

But when it is a create user, the jquery code detects that the class is createNew and there I call the validator creation.

    if ($('.createNew').length > 0){
          $('.createNew').click(function(){
                if ($(this).attr('id') == 'createUser'){
                createUserValidator(false);
                $("[name='user_id']").val("");

I am telling you all this in the final possibility that you can help me. If none of this helps you help me I am going to have to quit on this task. Regardless, I thank you for all you have tried and shown me.

Bill

[WildWillParticipant]

Peter,

Here is my validtor creation. I compare it to what you have. I am using a class, not an id to associate the validator to. Regarless of the hint type it doesn’t work. Works on one, doesn’t work on the other. If you think I do not know how to create a validator then point me to what I have done wrong.

Bill

    $(".commonButton").jqxValidator({
        position: 'left',
<< regardless of the following line being present, I get nothing >>
        hintType: 'label',
        rules: [
            {input: "[name='username']", message: 'Username is required!', action: 'keyup, blur', rule: 'required'},
            {input: "[name='username']", message: 'Your username must be between 4 and 50 characters!', action: 'keyup, blur', rule: 'length=4,50'},
            {input: "[name='email']", message: 'E-mail is required!', action: 'keyup, blur', rule: 'required'},
            {input: "[name='email']", message: 'Invalid e-mail!', action: 'keyup', rule: 'email'},
            {input: "[name='display_name']", message: 'Display (Real) Name is required!', action: 'keyup, blur', rule: 'required'},
            {input: "[name='display_name']", message: 'Your real name must not contain numbers!', action: 'keyup', rule: 'notNumber'}, 
            {input: "[name='newPassword']", message: 'Password is required!', action: 'keyup, blur', rule: 'required'},
            {input: "[name='newPassword']", message: 'Your password must be between 6 and 16 characters!', action: 'keyup, blur', rule: 'length=6,16'},
            {input: "[name='newPasswordVerify']", message: 'Password is required!', action: 'keyup, blur', rule: 'required'},
            {input: "[name='newPasswordVerify']", message: 'Passwords don\'t match!', action: 'keyup, focus', rule: function (input, commit) {
                   if (input.val() === $("[name='newPassword']").val()) {
                       return true;
                   }
                   return false;
                }
           }  
        ]
    });     

[WildWillParticipant]

Reposting the code used to create forms.

    <div>
        <br><br>
        <div id="createUser" class="submit createNew  createUserButton commonButton">
            <img class="createNewUserImg" style="width:25px; height=25px;" src="<?php echo $this->basePath('img/add.png') ?>"/>
        </div>
        <br><br>
        <div id="createUserGrid" class="jqxgrid jqxAdminUserGrid"></div>
    </div>

[WildWillParticipant]

<div id='dialogWindow'>
    <div id='dialogWindowHeader'>
        <span id='captureContainer' style="float:left;"></span>
    </div>
    <div id='dialogWindowContent' style="overflow: hidden">

        <div class="formDiv" id="userCreateForm">
        <?php echo $this->form()->openTag($userCreateForm);?>
            <table>
                <?php echo $this->formElement($userCreateForm->get('csrf')) . PHP_EOL; ?>
                <?php echo $this->formElement($userCreateForm->get('form_type')) . PHP_EOL; ?>
                <tr><td><label><?php echo $this->escapeHtml($userCreateForm->get('username')->getLabel()); ?></label></td>
                <td><?php echo $this->formElement($userCreateForm->get('username')) . PHP_EOL; ?></td></tr>
                <tr><td><label><?php echo $this->escapeHtml($userCreateForm->get('email')->getLabel()); ?></label></td>
                <td><?php echo $this->formElement($userCreateForm->get('email')) . PHP_EOL; ?></td></tr>
                <tr><td><label><?php echo $this->escapeHtml($userCreateForm->get('display_name')->getLabel()); ?></label></td>
                <td><?php echo $this->formElement($userCreateForm->get('display_name')) . PHP_EOL; ?></td></tr>
                <tr><td><label><?php echo $this->escapeHtml($userCreateForm->get('inventory_user_id')->getLabel()); ?></label></td>
                <td><?php echo $this->formElement($userCreateForm->get('inventory_user_id')) . PHP_EOL; ?></td></tr>
                <tr><td><label><?php echo $this->escapeHtml($userCreateForm->get('role_id')->getLabel()); ?></label></td>
                <td><?php echo $this->formElement($userCreateForm->get('role_id')) . PHP_EOL; ?></td></tr>
                <tr><td><label><?php echo $this->escapeHtml($userCreateForm->get('newPassword')->getLabel()); ?></label></td>
                <td><?php echo $this->formElement($userCreateForm->get('newPassword')) . PHP_EOL; ?></td></tr>
                <tr><td><label><?php echo $this->escapeHtml($userCreateForm->get('newPasswordVerify')->getLabel()); ?></label></td>
                <td><?php echo $this->formElement($userCreateForm->get('newPasswordVerify')) . PHP_EOL; ?></td></tr>
                <tr><td><label><?php echo $this->escapeHtml($userCreateForm->get('currentPassword')->getLabel()); ?></label></td>
                <td><?php echo $this->formElement($userCreateForm->get('currentPassword')) . PHP_EOL;
                ?></td></tr>
            </table>
            <br>
            <?php echo $this->formElement($userCreateForm->get('submit')) . PHP_EOL;  ?>
        <?php echo $this->form()->closeTag($userCreateForm);?>
        </div>
    </div>
</div>

[WildWillParticipant]

Peter,

I am trying to use the same validator code for both the create and edit as they have the same fields. They are both popups. The Create works with either type of hint. I get absolutely no hints or validation with the edit. I think it lies in the fact that the edit is not a static HTML form but rather created dynamically in jquery. I just don’t know what the problem is.

var editCellRenderer = function (row, columnfield, value, defaulthtml, columnproperties) {  
    return '<div onclick="editButtonPress(this);" type="button" class="btnEdit userButton commonButton jqx-rc-all jqx-rc-all-darkblue jqx-button jqx-button-darkblue jqx-widget jqx-widget-darkblue jqx-fill-state-normal jqx-fill-state-normal-darkblue" id="' + row +'" value="Edit User" style="width:100%"/>'
       +'<img class="userButtonEditImg" style="width:20px; height=20px;" src="img/pencil.png"/></div>';
};

[WildWillParticipant]

Peter,

I tried, still doesn’t work with lables.

Bill

[WildWillParticipant]

Oops. I forgot to look at the source. My bad. But, still, this is what we have and see above explanation of what is wrong.

[WildWillParticipant]

Peter,

I went and double checked the post, just to say I had, and when I click on the link you posted ( http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxvalidator/validation-label.htm?arctic) I just get a form that validates but no code behind it so I don’t know what the structure of the code is to try on my system. You have another link to that code?

Bill

[WildWillParticipant]

Peter,

I saw that but this is not the same problem. I am getting NOTHING now. With the HTML created form the validator works great with the hints where they should be. But when the form is created from the call in jquery I get no validation.

Bill

[WildWillParticipant]

Sorry, messed up the last piece of code submission:

var editCellRenderer = function (row, columnfield, value, defaulthtml, columnproperties) {  
                                        return '<div onclick="editButtonPress(this);" type="button" class="btnEdit userButton createUserButton jqx-rc-all jqx-rc-all-darkblue jqx-button jqx-button-darkblue jqx-widget jqx-widget-darkblue jqx-fill-state-normal jqx-fill-state-normal-darkblue" id="' + row +'" value="Edit User" style="width:100%"/>'
                                            +'<img class="userButtonEditImg" style="width:20px; height=20px;" src="img/pencil.png"/></div>';
                            };

[WildWillParticipant]

Peter,

No, that is not the issue I was having. I managed to solve that one. I am going to put in a new post for my problem now.

[WildWillParticipant]

I am having a horrible time figuring out my problem and this is close to my issue so I will ask here.

I have a dialog that is created but not shown until needed. The validaor hints show up in the wrong place. The dialog with the widget shows up in the center of the screen but the hints show up in the upper left hand corner.

Any idea?

Thanks,

WildWill

[WildWillParticipant]

I forgot to add. The dialog is created hidden and only exposed when needed.

[Author]

Posts