CODEWITHSUNDEEP
phpyii
Alex
Alex

Reputation: 683

Adding validation error to dynamic fields that do not belong to model

I'm currently using code that lets users create new form fields, then set them as either as required or not required. The problem I'm having is that as this is a component, and not in the model, I can't add it to the rules if validation is equal to 1 in the db.

How do I go about dynamically adding values to the rules? or at least adding errors to these fields. Ie. Adding a validator to all attr with the value of required field 1

class DynamicForm extends CWidget {


    public $attributes = array();
    public $id = null;
    public $enctype = null;
    public $target = null;
    public $action = null;
    public $model_name = '';
    public $method = 'post';

    public function init() {
        parent::init();
    }

 public function run() {
 foreach ($this->attributes as $attr) {
  $attr['formname'] = $this->model_name . '_' . $attr['name'];
            $attr['htmlOptions'] = array('class' => 'span5', 'placeholder' => $attr['name']);
            $attr['htmlOptions']['class'] .= ' form-control';

            if ($attr['required'] === 1){
                $attr['requiredfields'] = array('required' => true);
            }else{
                $attr['requiredfields'] = '';
            }
  if ($attr['type'] == 'text') {
                echo '<div class="form-group">';
                echo CHtml::label($attr['name'], $attr['formname'],$attr['requiredfields']);
                echo CHtml::textField($attr['formname'], $attr['value'], $attr['htmlOptions']);
                echo '</div>';
            } 
            elseif ($attr['type'] == 'radio') {
                echo '<div class="form-group">';
                echo CHtml::label($attr['name'], $attr['formname'],$attr['requiredfields']);
                echo CHtml::radioButton($attr['formname'],$attr['requiredfields']);
                echo '</div>';
            } 
            elseif ($attr['type'] == 'textarea') {
                echo '<div class="form-group">';
                echo CHtml::label($attr['name'], $attr['formname'],$attr['requiredfields']);
                echo CHtml::textArea($attr['formname'], $attr['value'], $attr['htmlOptions']);
                echo '</div>';
            } 
            elseif ($attr['type'] == 'select') {
                $items = explode(',', $attr['options']);
 echo CHtml::label($attr['name'], $attr['formname'],$attr['requiredfields']);
                //echo CHtml::dropDownList($attr['formname'], $attr['value'], array($items));
                echo CHtml::dropDownList($attr['formname'], $attr['value'], $items, array('class'=>'form-control','prompt'=>'Please Choose'));
                echo '</div>';
 } 
            elseif ($attr['type'] == 'boolean') {
                echo '<div class="form-group">';
                echo CHtml::label($attr['name'], $attr['formname'],$attr['requiredfields']);
                echo CHtml::radioButtonList($attr['formname'], $attr['value'], array('No' => 0, 'Yes' => 1));
                echo '</div>';
            }
        }
 }

}

edit the issue seems to be in my user model and this function 

public function getDynamicFormConfig() {
        // For each attribute in
        $varibles = array();

        //echo sizeof($this->type->userTypeVariables);

        if (sizeof($this->type->userTypeVariables) > 0) {

            foreach ($this->type->userTypeVariables as $var) {

                //$varibles[] = $var;
                $varibles[] = array(
                    'id' => $var->id,
                    'name' => $var->name,
                    'type' => $var->type,
                    'value' => $this->getDynamicVaribleValue($var->name),
                    'required' => $var->required,
                    'options' => $var->htmlOptions,
                );
               if ($var->required) {
                   $var->validatorList->add(
                           CValidator::createValidator('required',$this->getDynamicVaribleValue($var->name),'')
                   );
               }
            }
        }
        return $varibles;
    }

in particular, these lines 

 if ($var->required) {
      $var->validatorList->add(
           CValidator::createValidator('required',$this->getDynamicVaribleValue($var->name),'')
                    );
}

My form

<div class="clearfix"></div>
<?php
$varform = new DynamicForm();
$varform->attributes = $user->getDynamicFormConfig();
$varform->model_name = 'user';
echo $varform->run();
?>

<div class="clearfix"></div>
<div class="form-actions marginTopHalf marginBotHalf">
    <?php
    $this->widget('booster.widgets.TbButton', array(
        'buttonType' => 'submit',
        'context' => 'primary',
        'label' => $user->isNewRecord ? 'Sign Up for this event' : 'Save',
    ));
    ?>
</div>

Upvotes: 1

Views: 214

Answers (1)

Aamir Sarwar
Aamir Sarwar

Reputation: 271

Check this link hope it will help you...

http://www.jquerybyexample.net/2012/01/jquery-validation-using-class-required.html

I also copy the code and paste below so if link will not work then people can read from here and get help..

------copy from above link----------------------------------------------------

Well, 5 days back I received an mail from one of my reader, in which he had written that "I need to validation html page using Jquery by looping through Class attributes ["Class=Required"] if the label attribute contain "required" class then i should validate the alert the user "Please Enter your value" and set back the focus to null control to enter the value. Please suggest how to do this in Jquery coding".

Note: I did not write the name of the blog reader because I am not sure if he wants his name here or not.

He has a single HTML form with inputs like Name, Company, Job Title, Phone and Email. And on click of Submit, he wanted to validate the inputs which has "class=required". So I have created a demo page for his problem and send him the solution.

Below is the jQuery code, which solves his problem. On click of Submit button, it iterates through all the input type which has ".required" class. And checks the value, if it is empty then display an alert and set focus to the textbox.

01
    $(document).ready(function(){
02
        $('#btnSubmit').click(function(){
03
            $("input.required").each(function(){
04
                if($(this).val().length == 0)
05
                {
06
                   alert('Please Enter your value');
07
                   $(this).focus();
08
                   return false;
09
                }
10
            });
11
            //else submit your form.
12
        });
13
    });

See live Demo and Code Then very next day I received another email from him saying " I need to achieve through JQuery Validation, <Label> tag has the "class.required" attributes not the <Input> tag, those lable tag(s) has the "class.required" attributes only those needs to validates during use click the comman button and this JQuery script should be used globally across the website."

So his problem was the label tag is having the class "required", not the input tag. The solution which I have provided to him assuming that input tags has the required class as he has not mentioned that the label tag has the ".required" class in his first email. In his next email, he had also sent me the HTML code. First take a look at HTML code. (I have not put the whole code.)

1
    <div class="formField">
2
       <label for="txtFullName" class="required">Name</label>
3
       <input id="txtFullName"  type="text" name="Full_Name" />  
4
    </div>

He was using class ".reuqired" with label along with HTML for attribute. The for attribute specifies which form element a label is bound to. So it put me in thoughts for 2 mins but I found a solution. This time, I was iterating through all the label which has ".required" class. And also getting the value of for attribute. As the for attribute value is same as the textbox id. So based on the for attribute value, I created object using jQuery selectors. And rest is equal to previous solution.

01
    $(document).ready(function(){
02
        $('#btnSubmit').click(function(){
03
            var bSubmit = true;
04
            $("label.required").each(function(){
05
                var txtAttrb = $(this).attr('for');
06
                if(txtAttrb.length > 0)
07
                {
08
                    var txtVal = $("input[id=" + txtAttrb + "]");
09
                    if(txtVal.val().length == 0)
10
                    {
11
                       alert('Please Enter your value');
12
                       txtVal.focus();
13
                       bSubmit = false;
14
                       return false;
15
                    }
16
                }
17
            });
18

19
            if(bSubmit == true)
20
            {
21
                //submit the form.
22
            }
23
        });
24
    });

See live Demo and Code Hope this helps you as well

Upvotes: 1

Related Questions