jQuery Forum

I have the following code which works fine:

1. var blackshFunction= function() {
         var j=0;
         for(var i=2;i<9;i++) {
            $("#altviews a").eq(j).attr("href","/v/vspfiles/photos/SMART-HOLSTER-" + i + ".jpg");
             $("#altviews a img").eq(j).attr("src","/v/vspfiles/photos/SMART-HOLSTER-" + i + "S.jpg");
            j=parseInt(j)+1;
         }
         $("#altviews a").eq(6).show();
         $("#altviews a img").eq(6).show();
   }
   var brownshFunction= function() {
         var j=0;
         for(var i=9;i<15;i++) {
            $("#altviews a").eq(j).attr("href","/v/vspfiles/photos/shbrown/SMART-HOLSTER-" + i + ".jpg");
            $("#altviews a img").eq(j).attr("src","/v/vspfiles/photos/shbrown/SMART-HOLSTER-" + i + "S.jpg");
            j=parseInt(j)+1;
         }
         $("#altviews a").eq(j).hide();
         $("#altviews a img").eq(j).hide();
   }
   $(document).ready(function() {
      $('#options_table a:eq(0)').click(blackshFunction);
      $('#options_table a:eq(1)').click(brownshFunction);
   });

I have a contact form on my website using the validate plugin.

It has been working fine for years, until just recently. I haven't changed the form itself, but I did update to jquery 1.8.3.

Now the validation images are showing up in the wrong place, and for the wrong fields.

You can try it out at http://webrecipemanager.com/index-5.php

I have a menu planner that looks like this



My problem is that sometimes when I drop a recipe from the menu on a slot, it ends up in the next slot to the right instead. So if I drop something in the first Mon slot, it ends up un the first tue slot. Not always though. Hope that makes sense.

Here is the html

1. <div id=drop>
                   <table id=menuplan>
                   <th></th>
                   <th>Mon</th>
                   <th>Tue</th>
                   <th>Wed</th>
                   <th>Thu</th>
                   <th>Fri</th>
                   <th>Sat</th>
                   <th>Sun</th>
                   <tr>
                   <td class=meal>
                       B'fast
                   </td>
                   <td>
                   <div name=mon1 id=droppablemon1></div>
                   <div name=mon2 id=droppablemon2></div>
                   <div name=mon3 id=droppablemon3></div>
                   <div name=mon4 id=droppablemon4></div>
                   </td>
                   <td>
                   <div name=tue1 id=droppabletue1></div>
                   <div name=tue2 id=droppabletue2></div>
                   <div name=tue3 id=droppabletue3></div>
                   <div name=tue4 id=droppabletue4></div>
                   </td>
                   <td>
                   <div name=wed1 id=droppablewed1></div>
                   <div name=wed2 id=droppablewed2></div>
                   <div name=wed3 id=droppablewed3></div>
                   <div name=wed4 id=droppablewed4></div>
                   </td>
                   <td>
                   <div name=thu1 id=droppablethu1></div>
                   <div name=thu2 id=droppablethu2></div>
                   <div name=thu3 id=droppablethu3></div>
                   <div name=thu4 id=droppablethu4></div>
                   </td>
                   <td>
                   <div name=fri1 id=droppablefri1></div>
                   <div name=fri2 id=droppablefri2></div>
                   <div name=fri3 id=droppablefri3></div>
                   <div name=fri4 id=droppablefri4></div>
                   </td>
                   <td>
                   <div name=sat1 id=droppablesat1></div>
                   <div name=sat2 id=droppablesat2></div>
                   <div name=sat3 id=droppablesat3></div>
                   <div name=sat4 id=droppablesat4></div>
                   </td>
                   <td>
                   <div name=sun1 id=droppablesun1></div>
                   <div name=sun2 id=droppablesun2></div>
                   <div name=sun3 id=droppablesun3></div>
                   <div name=sun4 id=droppablesun4></div>
                   </td>
                   </tr>
                   <th></th>
                   <th>Mon</th>
                   <th>Tue</th>
                   <th>Wed</th>
                   <th>Thu</th>
                   <th>Fri</th>
                   <th>Sat</th>
                   <th>Sun</th>
                   <tr>
                   <td class=meal>
                       Lunch
                   </td>
                   <td>
                   <div name=mon5 id=droppablemon5></div>
                   <div name=mon6 id=droppablemon6></div>
                   <div name=mon7 id=droppablemon7></div>
                   <div name=mon8 id=droppablemon8></div>
                   <div name=mon9 id=droppablemon9></div>
                   <div name=mon10 id=droppablemon10></div>
                   </td>
                   <td>
                   <div name=tue5 id=droppabletue5></div>
                   <div name=tue6 id=droppabletue6></div>
                   <div name=tue7 id=droppabletue7></div>
                   <div name=tue8 id=droppabletue8></div>
                   <div name=tue9  id=droppabletue9></div>
                   <div name=tue10 id=droppabletue10></div>
                   </td>
                   <td>
                   <div name=wed5 id=droppablewed5></div>
                   <div name=wed6 id=droppablewed6></div>
                   <div name=wed7 id=droppablewed7></div>
                   <div name=wed8 id=droppablewed8></div>
                   <div name=wed9  id=droppablewed9></div>
                   <div name=wed10 id=droppablewed10></div>
                   </td>
                   <td>
                   <div name=thu5 id=droppablethu5></div>
                   <div name=thu6 id=droppablethu6></div>
                   <div name=thu7 id=droppablethu7></div>
                   <div name=thu8 id=droppablethu8></div>
                   <div name=thu9  id=droppablethu9></div>
                   <div name=thu10 id=droppablethu10></div>
                   </td>
                   <td>
                   <div name=fri5 id=droppablefri5></div>
                   <div name=fri6 id=droppablefri6></div>
                   <div name=fri7 id=droppablefri7></div>
                   <div name=fri8 id=droppablefri8></div>
                   <div name=fri9  id=droppablefri9></div>
                   <div name=fri10 id=droppablefri10></div>
                   </td>
                   <td>
                   <div name=sat5 id=droppablesat5></div>
                   <div name=sat6 id=droppablesat6></div>
                   <div name=sat7 id=droppablesat7></div>
                   <div name=sat8 id=droppablesat8></div>
                   <div name=sat9  id=droppablesat9></div>
                   <div name=sat10 id=droppablesat10></div>
                   </td>
                   <td>
                   <div name=sun5 id=droppablesun5></div>
                   <div name=sun6 id=droppablesun6></div>
                   <div name=sun7 id=droppablesun7></div>
                   <div name=sun8 id=droppablesun8></div>
                   <div name=sun9  id=droppablesun9></div>
                   <div name=sun10 id=droppablesun10></div>
                   </td>
                   </tr><div id=drop>
                   <table>
                   <th></th>
                   <th>Mon</th>
                   <th>Tue</th>
                   <th>Wed</th>
                   <th>Thu</th>
                   <th>Fri</th>
                   <th>Sat</th>
                   <th>Sun</th>
                   <tr>
                   <td class=meal>
                       B'fast
                   </td>
                   <td>
                   <div name=mon1 id=droppablemon1></div>
                   <div name=mon2 id=droppablemon2></div>
                   <div name=mon3 id=droppablemon3></div>
                   <div name=mon4 id=droppablemon4></div>
                   </td>
                   <td>
                   <div name=tue1 id=droppabletue1></div>
                   <div name=tue2 id=droppabletue2></div>
                   <div name=tue3 id=droppabletue3></div>
                   <div name=tue4 id=droppabletue4></div>
                   </td>
                   <td>
                   <div name=wed1 id=droppablewed1></div>
                   <div name=wed2 id=droppablewed2></div>
                   <div name=wed3 id=droppablewed3></div>
                   <div name=wed4 id=droppablewed4></div>
                   </td>
                   <td>
                   <div name=thu1 id=droppablethu1></div>
                   <div name=thu2 id=droppablethu2></div>
                   <div name=thu3 id=droppablethu3></div>
                   <div name=thu4 id=droppablethu4></div>
                   </td>
                   <td>
                   <div name=fri1 id=droppablefri1></div>
                   <div name=fri2 id=droppablefri2></div>
                   <div name=fri3 id=droppablefri3></div>
                   <div name=fri4 id=droppablefri4></div>
                   </td>
                   <td>
                   <div name=sat1 id=droppablesat1></div>
                   <div name=sat2 id=droppablesat2></div>
                   <div name=sat3 id=droppablesat3></div>
                   <div name=sat4 id=droppablesat4></div>
                   </td>
                   <td>
                   <div name=sun1 id=droppablesun1></div>
                   <div name=sun2 id=droppablesun2></div>
                   <div name=sun3 id=droppablesun3></div>
                   <div name=sun4 id=droppablesun4></div>
                   </td>
                   </tr>
                   <th></th>
                   <th>Mon</th>
                   <th>Tue</th>
                   <th>Wed</th>
                   <th>Thu</th>
                   <th>Fri</th>
                   <th>Sat</th>
                   <th>Sun</th>
                   <tr>
                   <td class=meal>
                       Lunch
                   </td>
                   <td>
                   <div name=mon5 id=droppablemon5></div>
                   <div name=mon6 id=droppablemon6></div>
                   <div name=mon7 id=droppablemon7></div>
                   <div name=mon8 id=droppablemon8></div>
                   <div name=mon9 id=droppablemon9></div>
                   <div name=mon10 id=droppablemon10></div>
                   </td>
                   <td>
                   <div name=tue5 id=droppabletue5></div>
                   <div name=tue6 id=droppabletue6></div>
                   <div name=tue7 id=droppabletue7></div>
                   <div name=tue8 id=droppabletue8></div>
                   <div name=tue9  id=droppabletue9></div>
                   <div name=tue10 id=droppabletue10></div>
                   </td>
                   <td>
                   <div name=wed5 id=droppablewed5></div>
                   <div name=wed6 id=droppablewed6></div>
                   <div name=wed7 id=droppablewed7></div>
                   <div name=wed8 id=droppablewed8></div>
                   <div name=wed9  id=droppablewed9></div>
                   <div name=wed10 id=droppablewed10></div>
                   </td>
                   <td>
                   <div name=thu5 id=droppablethu5></div>
                   <div name=thu6 id=droppablethu6></div>
                   <div name=thu7 id=droppablethu7></div>
                   <div name=thu8 id=droppablethu8></div>
                   <div name=thu9  id=droppablethu9></div>
                   <div name=thu10 id=droppablethu10></div>
                   </td>
                   <td>
                   <div name=fri5 id=droppablefri5></div>
                   <div name=fri6 id=droppablefri6></div>
                   <div name=fri7 id=droppablefri7></div>
                   <div name=fri8 id=droppablefri8></div>
                   <div name=fri9  id=droppablefri9></div>
                   <div name=fri10 id=droppablefri10></div>
                   </td>
                   <td>
                   <div name=sat5 id=droppablesat5></div>
                   <div name=sat6 id=droppablesat6></div>
                   <div name=sat7 id=droppablesat7></div>
                   <div name=sat8 id=droppablesat8></div>
                   <div name=sat9  id=droppablesat9></div>
                   <div name=sat10 id=droppablesat10></div>
                   </td>
                   <td>
                   <div name=sun5 id=droppablesun5></div>
                   <div name=sun6 id=droppablesun6></div>
                   <div name=sun7 id=droppablesun7></div>
                   <div name=sun8 id=droppablesun8></div>
                   <div name=sun9  id=droppablesun9></div>
                   <div name=sun10 id=droppablesun10></div>
                   </td>
2.                 </tr>

After adding jquery ui 1.9 to my jquery mobile web app I am getting the following error in firebug

string is undefined.

This error occurs in jquery-1.6.4.js at line 622 this is the code

1. camelCase: function( string ) {
   return string.replace( rmsPrefix, "ms-" ).replace( rdashAlpha, fcamelCase );
   },

I did a serch through all the js in my project and the only place I can find any reference to camelCase is in jquery.mobile-1.1.0.js line 1384

This is the line of code

1. return nsNormalizeDict[ prop ] || ( nsNormalizeDict[ prop ] = $.camelCase( $.mobile.ns + prop ) );

Not sure where the issue lies, and which forum I should be posting on to find a solution, but any help would be appreciated.

I am loading some html into a div
Then I need to calculate the height of the div once the html is added.

My problem is that the height calculation occurs before the html is loaded sometimes.

Here is my code executed at the completion of the ajax call to get the html.

1. if (value) {
       $('#lmenu').html(value);
       pageheight();       
   }
   

the pageheight function is

1. function pageheight() {
       var menuheight = parseInt($("#lmenu").height()) + parseInt($("#menu").height());       
       var recheight = parseInt($(".ui-page-active").height());       
      
       if (menuheight > recheight) {
           $(".ui-page-active").height(menuheight);   
       }       
   }
   

I tried checking if the div was not empty before running the function, but the function didn't get called. A shame .html doesn't have a callback, but my research on this problem indicates that it shouldn't be required.

I'm dragging and dropping multiple objects using the multidraggable plugin.

In the drop function I access all the dragged objects using the code below.

This works fine the first time I drag and drop some objects. The second time however, the elements var not only contains the objects just dragged, but also the ones dragged the previous time.

I've checked the html after the first drag using firebug, and can't see any objects with class ui-draggable-dragging.

Could anyone tell me what I'm doing wrong?

1. var elements = $(".ui-draggable-dragging").siblings().andSelf();           

Is there a way to override the default behaviour for single selects which makes it impossible to unselect a  selected item?

What i need is: when someone clicks on an option, if it isn't selected is should be selected, but if it's already selected then it should be unselected.

I hope this makes sense.

I am using the validate plugin on my contact page

It all works perfectly in Firefox.

In IE8 however everything works except that the image doesn't show when the input is correct. The image does show when something is wrong though.

Any help would be much appreciated.

I'm using the OCUpload jquery plugin (version 1.1.2) on my site to upload images. It has worked great up until now. I upgraded to IE8 recently and now the upload doesn't trigger (Uploading file... not displayed) the first time you browse to a file, but works perfectly the second time, every time.

I would ask the author, but none of the links for his plugin work any more.

Here's the code

Javascript


//image upload
   $('#imagefl').upload({
      name: 'file',
      method: 'post',
      enctype: 'multipart/form-data',
      action: 'upload.php',
      onSubmit: function() {
         $('#progress1').text('Uploading file...');
      },
      onComplete: function(data) {
         //data contains the response from the action url
         var image = $('div.image');
         $(image).after('<div class=image id=imagedisp><img src="imagetmp/'+data+'"><br><a id=hideimg href="#">Hide image</a><input id= newimage name=newimage type=hidden value="'+data+'"></div>');
         $('#progress1').text('');
         $(image).remove();
      }
   });



HTML


<input type="hidden" name="MAX_FILE_SIZE" value="524288">            
            <input name='imagefl' id='imagefl' size='22.5' class='fle' type='file'>
            <span id="progress1"> Please ensure your image names don't contain any special characters like %</span>



Hi there,

Im using $.post and have a lot of repeating elements I need to post like the cat elements in the example code below.

I was hoping that I could use a loop in some way to add the repeating elements rather than listing them one by one.

Any ideas would be appreciated.


$.post("save.php",{
       id:$('#id').val(),
       save:$('#submit').val(),
       name:$('#name').val(),
       image:$('#image').val(),
       newimage:$('#newimage').val(),
       measure:$('#measure').val(),
       cat0:$('#cat0').val(),
       cat1:$('#cat1').val(),
       cat2:$('#cat1').val(),
       cat3:$('#cat3').val()      
     } ,function(data) {....



Hi there,

Could some kind person please tell me how to achieve the following with a loop, rather than repeating for each element.

$('#hshowcat0').livequery('click',function(event) {
$(this).hide();
$('#showcat1').show();
$('#category1').show();
return false;
});
$('#hshowcat1').livequery('click',function(event) {
$(this).hide();
$('#showcat2').show();
$('#category2').show();
return false;
});