Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>This will grab the form element's data-message attribute:</p> <pre><code>$("#orders_csv").data("message") </code></pre> <p>It works with jQuery 1.43 and above. See the jQuery docs <a href="http://api.jquery.com/data/#data-html5" rel="nofollow">here</a>. Put this in whatever response mechanism you have for your validation (alert, jQuery UI popup, etc.).</p> <p>You're using jQuery Tools for validation, it seems. To do what you want, to get the right tooltip to appear, you need to actually add a validation routine to the validator. Here's how I believe it should go:</p> <pre><code>$.tools.validator.fn("#dealers_csv, #orders_csv", function(element, value) { var correctFilename = (element.attr("id") === "dealers_csv" ? "mcust.csv" : "morders.csv"), $element = $(element), filename = value.split("\\").pop(); if (filename !== correctFilename) { return $element.attr("data-message"); } else { return true; } }); </code></pre> <p>Add this validation routine after your call to <code>$("#upload-form").validator()</code>. And remove most of the <code>.change()</code> event handlers, leaving only the following:</p> <pre><code>$("input#dealers_csv, input#orders_csv").on("change", function() { $('#loader').hide(); }); </code></pre> <p>Here's the complete code:</p> <pre><code>$(document).ready(function () { $("#upload-form").validator({ position: 'top center', offset: [-12, 40], relative: true, accept: "csv", message: '&lt;div&gt;&lt;em&gt;&lt;/em&gt;&lt;/div&gt;' }); // the custom validation routine, checking only those elements with the ids in the selector $.tools.validator.fn("#dealers_csv, #orders_csv", function(element, value) { var correctFilename = (element.attr("id") === "dealers_csv" ? "mcust.csv" : "morders.csv"), $element = $(element), filename = value.split("\\").pop(); if (filename !== correctFilename) { return $element.attr("data-message"); } else { return true; } }); // new, simplified event handler, to clear the "#loader" element when there's a change to the upload inputs $("#dealers_csv, #orders_csv").on("change", function() { $('#loader').hide(); }); }); </code></pre> <p>Principle difference between this code and your original is that, when failing validation for the upload inputs, it doesn't clear the value in them; your previous version did. I thought that clearing the input was kind of antithetical to validation, and felt wrong placing it in the validation routine.</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload