2

So i have a form that has two submit buttons, but for each i want to validate different fields, in this case when i click on the preview submit button i want to ignore 3 fields, while in the 'normal' submit button i want to validate all. Is this possible?

Here's some html:

<form class="form" role="form" id="searchesForm">
  
   <input class="form-control" type="text" id="name" name="name"/>
   <input class="form-control" type="text" id="widgetWidth"  name="widgetWidth" /> 
   <input class="form-control" type="text" id="widgetHeight"  name="widgetHeight" />
   <!-- More fields validated for both button clicks-->
   ...
  
   <button type="button" id="preview" name="previewSearch" class="btn btn-default" >
     Preview
   </button>
   <button type="submit" id="submit" name="submitSave" class="btn btn-primary">
     Save
   </button>
</form>

So the idea is that when i press the preview button these 3 fields(name, widgetWidth and widgetHeight) should be ignored, but not when i press the save button.

Here's my bootstrap validator:

$('#searchesForm').bootstrapValidator({
                excluded: ['td>select,td>input,td>textarea'],
                feedbackIcons:{
                    valid: 'glyphicon glyphicon-ok',
                    invalid: 'glyphicon glyphicon-remove',
                    validating: 'glyphicon glyphicon-refresh'
                },
                live:'submitted',
                submitButtons:'[type="submit"]',
                fields: {
                    name: {
                        validators: {
                            notEmpty: {
                                enabled:function(){
                                    debugger;
                                    alert("testes");
                                },
                                message: 'The question required and cannot be empty'
                            }
                        }
                    }
                }
            }).on('success.form.bv',function(e){
                // Prevent form submission
                e.preventDefault();
                //check which button was pressed
                var button=$(e.target).data('bootstrapValidator').getSubmitButton();

                if($(button).attr("id")==="preview"){
                    
                    previewSearch();//do ajax stuff

                }else{
                    saveSearch();//do ajax stuff
                }

             
            }).on('error.form.bv',function(e){

                var invalidFields=$(e.target).data('bootstrapValidator').getInvalidFields();

                //show tab for specific fields location
                $.each(invalidFields,function(index,value){

                    if($("#filtros").has(value).length > 0){
                        $('#tabs li:eq(0) a').tab('show')
                    }
                    if($("#resultado").has(value).length > 0){
                        $('#tabs li:eq(1) a').tab('show')
                    }
                    if($("#widget").has(value).length > 0){
                        $('#tabs li:eq(2) a').tab('show')
                    }
                });
            }).on('status.field.bv', function (e, data) {

                if (data.bv.getSubmitButton()) {
                    data.bv.disableSubmitButtons(false);
                }

                if(data.bv.getSubmitButton()) {
                    if (data.bv.getSubmitButton().attr("id") === "preview"){
                        if (data.field === "name" || data.field === "widgetWidth" || data.field === "widgetHeight") {
                            
                            data.bv.$form.bootstrapValidator('enableFieldValidators', data.field, 'notEmpty', false);
                        }
                    }else{
                       
                        data.bv.$form.bootstrapValidator('enableFieldValidators', data.field, 'notEmpty', true);
                    }
                }
            });

I don't really know where can we enable/disable the field validator according to the button pressed. i tried to change the status of the fields validator on the .on('status.field.bv'...) method but it doesn't work completely. Also the submitButtons don't seem to work if i choose something other than "type=submit".

So has anyone come up with this situation?

cvrebert
  • 9,075
  • 2
  • 38
  • 49
Maxrunner
  • 1,955
  • 4
  • 24
  • 41
  • Not going to post this as an answer because I don't know enough about the validation extension. When you click a button, you set a flag depending on which button was clicked and then submit the form so that validation code gets executed. Then, the validation scripts filter callback method just needs to check the input element being validated and the flag to determine whether it should be validated: http://reactiveraven.github.io/jqBootstrapValidation/ – Kevin Nelson Mar 09 '15 at 21:48

0 Answers0