FormsBootstrap

A Laravel library to generate forms based on Laravel Collective Forms & HTML, Boostrap 5 CSS Framework, RichText editor, and Icons provided by FontAwesome. Current version: 2.1.7. Project on GitHub. Project on Packagist. Manages also results inputs of packages DateRangePickerHelper, Uploader, and Tags input. Includes form management and validation. This demosite sources available here.

Form


{!! Form::bsOpen([
  'id' => 'form_form', //form id
  'ajaxcallback' => 'processform',
  'action' => route('formsbootstrap_processform'), //url where form is submitted to
  'additionalbuttons' => [['id' => 'form_form_cancelbtn', 'class' => 'btn btn-secondary', 'value' => 'Cancel']]
]) !!}
{!! Form::bsClose() !!}

Output:
<form
id="form_form"
novalidate="novalidate"
action="https://sebastien.lhaire.org/formsbootstrap/processform"
method="post"
>
<input type="hidden" id="_token" name="_token" value="ykkdJ8KwOxBTEEbTOjqkzUpxkgjCY2YUQxpn9BrE" />
<script>
jQuery(document).ready(function() {
jQuery('#form_form').sebFormHelper({
validate : true,
checkonleave : true,
ajaxcallback : processform,
filldatacallback : null,
requiredclass : 'verify',
requiredcheckclass : 'verify-check',
selcheckclass : 'selcheck',
requiredspecialclass : 'verify-special',
verifymailclass : 'verify-email',
verifypassclass : 'verify-pass',
verifypassmatchclass : 'verify-pass-match',
verifypassold : 'verify-pass-old',
resettextclass : 'resettext',
resetselectclass : 'resetselect',
resetcheckclass : 'resetcheck',
resetradioclass : 'resetradio',
csrfrefreshroute : null,
data_build_function : null,
remove_validation_function : null,
clearonclick_function : null,
validate_function : null,
clear_function : null,
csrf : 'ykkdJ8KwOxBTEEbTOjqkzUpxkgjCY2YUQxpn9BrE',
check_modified_on_reset : true,
modified_on_reset_confirm_text : 'This form has been modified. Are you sure you want to reset it ?',
buildbuttons: true,
buildresultalert: true,
alertsuccessclass: 'alert-success',
alerterrorclass: 'alert-danger',
alertcommonclass : 'alert',
alertdisplaytimeok : 4000,
alertdisplaytimefalse : 8000,
resultok: 'Result OK',
resultfalse: 'Processing error',
buttondivclass: 'mb-3 btngroup',
submitbtnclass: 'btn btn-primary',
additionalbuttons: [{"id":"form_form_cancelbtn","class":"btn btn-secondary","value":"Cancel"}],
submitbtnlbl: 'Send',
evalajaxres_callback: null,
evalajaxres_resultmessage: null,
resetvalues: []
});
});
</script>
</form>
<script type="text/javascript"> jQuery(document).ready(function(){ jQuery('#form_form_cancelbtn').on('click', function(e){ alert("cancel clicked"); }); }); </script>

In this example, elements are generated and added to form. Hidden input with CSRF token is added automatically. By default, submit button is added. Here we also add cancel button. And finally a result zone is added and used to display success message or error messages. See package documentation for details.







Results