change validation message bagisto

Question

I am using Bagisto and want to change the validation message only for particular field

Code is as below

<div id="osAxisDiv" class="pres-select-form" :class="[errors.has('os_axis') || osaxiserror ? 'has-error' : '']">
                                        <input
                                            class="form-control"
                                            id="os_axis"
                                            type="number"
                                            name="os_axis"
                                            disabled
                                            v-validate="'required|min_value:1|max_value:180'"
                                            :data-vv-as="'&quot;Axis&quot;'"
                                        />
                                    </div>
                                    <div id="osAxisErr2" 
                                        class="control-error"
                                        v-if="errors.has('os_axis')"
                                        v-text="errors.first('os_axis')"
                                    ></div>
                                    <div id="osAxisErr1" 
                                        class="control-error"
                                        v-if="osaxiserror"
                                        v-text="`${osaxiserror}`"
                                    ></div> 

The message shows now is

The "Axis" field must be 180 or less

And want to change it. min and max validation messages are already in the language file but if I change that it will change for all min and max.

I have tried

in template file

 <div id="odAxisDiv" class="pres-select-form" :class="[errors.has('od_axis') || odaxiserror ? 'has-error' : '']">
    <input
      class="form-control"
      id="od_axis"
      type="number"
      name="od_axis"
      disabled
      v-validate="'required|min_value:1|max_value:180'"
      :data-vv-as="'Axis'"
    />
    <span v-if="errors.has('od_axis') || odaxiserror" class="error">
      {{ getOdAxisErrorMessage() }}
    </span>
  </div>

  <div id="odAxisErr2" class="control-error" v-if="errors.has('od_axis')" v-text="getOdAxisErrorMessage()"></div>
  <div id="odAxisErr1" class="control-error" v-if="odaxiserror" v-text="getOdAxisErrorMessage()"></div>

in vue

getOdAxisErrorMessage() {

      if (this.errors.has('od_axis')) {
        return this.errors.first('od_axis') || 'Axis values range from 1 to 180.';
      } else if (this.odaxiserror) {
        return this.odaxiserror;
      } else {
        return 'Axis values range from 1 to 180.'; 
      }
    },

the component is default template. This code is also not working.

Answer 1

i don't use Bagisto but based on what you are trying to do i would try:

<div id="odAxisErr2" class="control-error" v-if="errors.has('od_axis')" v-text="hardcode the error or get it from the error object"></div>

<div id="odAxisErr1" class="control-error" v-else-if="odaxiserror" v-text="hardcode the error or get it from the error object"></div>

<div id="odAxisErr3" class="control-error" v-else-if="here-you-just-che" v-text="Axis values range from 1 to 180."></div>

clearly you have to make sure the if conditions are correct as i don't think you can call a function from v-text.

If you want to customize the error message in the backend maybe this article helps