figured it out had to mode autobox to have unique input box names as autoobox does not put in any names or id's on the input bummer I hate moding plugins
Mean Mike
On Jul 13, 2:30 pm, Mean Mike <mcgra...@gmail.com> wrote:
> I've been trying to figure out how to add validation to jquery.autobox
> and it works except if I have more than one on the page it only
> validates the first one on submit though it will validate all other
> fields around it ! I can get it to validate the remaining autobox
> inputs if I give them focus and then take it a way that said I could
> get around the problem by setting focus on inputs then setting focus
> on something else but that's just sloppy coding.
>
> here is the html before it is submited
>
> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
> <html>
> <head>
> <title></title>
> </head>
> <body>
> <form id="myform" action="commit_album" method="post"
> name="myform">
> <ul class="ui-sortable" id="imagelist">
> <li class="info" id="li1">
> <label class="categorylabel
> accordion" id="label1"><img src="/
> secure/img/accordionopen.gif" alt="toggle accordion">Image 1:</label>
> <div class="block" id="block1">
> <div class="imagecontainer"
> id="imagecontainer1">
> <img
> src="/img/image_854_1.JPG">
> <p id="remove1"
> class="remove" name="1">
> Remove
> </p>
> </div>
> <div class="infocontainer"
> id="infocontainer1">
> <ul id="ul1">
> <li>
>
> <label>Photographer</label><input name="photographer1"
> class="required" type="text">
> </li>
> <li>
>
> <label>File Title</label><input id="title1" name="title1"
> class="required" type="text">
> </li>
> <li>
>
> <label>File Description/Caption</label>
>
> <textarea name="caption1" rows="5" cols="40"
> class="textfield">
> </textarea>
> </li>
> <li>
>
> <label>Embargo date</label><input id="embargodate1"
> name="embargodate1" class="required" type="text"><img src="/secure/img/
> cal.gif">
> </li>
> <li>
>
> <label for="tags1" class="accordion">Tags</label>
> <ul>
>
> <li>
>
> <input style="display: none;" id="tags1" class="autobox"
> type="text">
>
> <ul class="autobox-hldr">
>
> <li class="autobox-input">
>
> <input class="tag_check" id="abi0" type="text">
>
> </li>
>
> </ul>
>
> </li>
> </ul>
> </li>
> </ul>
> </div>
> </div>
> </li>
> <li class="info" id="li2">
> <label class="categorylabel
> accordion" id="label2"><img src="/
> secure/img/accordionopen.gif" alt="toggle accordion">Image 2:</label>
> <div class="block" id="block2">
> <div class="imagecontainer"
> id="imagecontainer2">
> <img
> src="/img/063shell.jpg">
> <p id="remove2"
> class="remove" name="2">
> Remove
> </p>
> </div>
> <div class="infocontainer"
> id="infocontainer2">
> <ul id="ul2">
> <li>
>
> <label>Photographer</label><input name="photographer2"
> class="required" type="text">
> </li>
> <li>
>
> <label>File Title</label><input id="title2" name="title2"
> class="required" type="text">
> </li>
> <li>
>
> <label>File Description/Caption</label>
>
> <textarea name="caption2" rows="5" cols="40"
> class="textfield">
> </textarea>
> </li>
> <li>
>
> <label>Embargo date</label><input id="embargodate2"
> name="embargodate2" class="required" type="text"><img src="/secure/img/
> cal.gif">
> </li>
> <li>
>
> <label for="tags2" class="accordion">Tags</label>
> <ul>
>
> <li>
>
> <input style="display: none;" id="tags2" class="autobox"
> type="text">
>
> <ul class="autobox-hldr">
>
> <li class="autobox-input">
>
> <input class="tag_check" id="abi1" type="text">
>
> </li>
>
> </ul>
>
> </li>
> </ul>
> </li>
> </ul>
> </div>
> </div>
> </li>
> </ul>
> </form>
> </body>
> </html>
>
> and the query that makes it all happen
>
> $(document).ready(function(){
>
> function apply_autobox(objid) {
> $(objid).autobox({
> list: suggestions,
> match: function(typed) {
> this.typed = typed;
> this.pre_match = this.text;
> this.match = this.post_match = '';
> if (!this.ajax && !typed || typed.length === 0) {
> return true;
> }
> var match_at = this.text.search(new RegExp("\\b" + typed,
> "i"));
> if (match_at != -1) {
> this.pre_match = this.text.slice(0, match_at);
> this.match = this.text.slice(match_at, match_at +
> typed.length);
> this.post_match = this.text.slice(match_at +
> typed.length);
> return true;
> }
> return false;
> },
> insertText: function(obj) {
> return obj.text;
> },
> templateText: "<li><%= pre_match %><span class='matching' ><%=
> match %></span><%= post_match %></li>",
> });
>
> };
>
> function add_validation_methods() {
> jQuery.validator.addMethod("tags", function(value,element) {
> return this.optional(element) || value.match(/^[a-zA-Z0-9,!\$
> ]+
> $/);
> }, "Tags can consist of letters, numbers. Tags to be hidden from
> Live2 should start with a \"!\" Anything else is not allowed.");
>
> jQuery.validator.addMethod("tag_exists", function(value, element) {
> return $(element).parent().prev().attr("class") == "bit-box";
> }, "This field is required to contain tags.");
>
> jQuery.validator.addClassRules({
> tag_check:{
> tag_exists: true,
> tags: true
> }
> });
>
> };
>
> add_validation_methods();
> apply_autobox("#tags" + id);
> $("li .autobox-input :input").addClass("tag_check");
>
> });
>
> any help would be greatly appreciated
> Mean Mike
