I have been trying to load gif image until ajax load the data and show it. but i am feeling comforted to it. I hope you can help me out there..this is my code for advance search. Now i want to add loading gif for this.\[code\]$.ajax({ type: 'POST', url: base_rul+'site/advancedsearch', data: { keyValues: keyValues }, dataType: 'json', success: function(data) { var content = ['']; if(data.status=='1') { //for(var k=1;k<=2;k++){ //for chapter1 starts if( data.item.chapter[1] && data.item.chapter[1].length>=1){ for(i=0;i<data.item.chapter[1].length;i++){ var obj = data.item.chapter[1]; //alert(data.item.chapter[1][0].chapter_row); if(data.item.chapter[1].chapter_row==0){ content.push('<h3>Chapter 18 New Health Care Occupancy</h3>'); } content.push('<ul><li><div>'); content.push('<p>'+obj.section_number +' '+ obj.title+'</p>'); content.push('</div></li></ul>'); }//end for each loop }//end if //for chapter1 ends //for chapter2 starts if( data.item.chapter[2] && data.item.chapter[2].length>=1){ for(i=0;i<data.item.chapter[2].length;i++){ var obj = data.item.chapter[2]; //alert(data.item.chapter[1][0].chapter_row); if(data.item.chapter[2].chapter_row==0){ content.push('<h3>Chapter 19 Existing Health Care Occupancy</h3>'); } content.push('<ul><li><div>'); content.push('<p>'+obj.section_number +' '+ obj.title+'</p>'); content.push('</div></li></ul>'); }//end for each loop }//end if //for chapter2 ends //for chapter3 starts if( data.item.chapter[3] && data.item.chapter[3].length>=1){ for(i=0;i<data.item.chapter[3].length;i++){ var obj = data.item.chapter[3]; if(data.item.chapter[3].chapter_row==0){ content.push('<h3>Chapter 20 New Ambulatory Health Care Occupancy</h3>'); } content.push('<ul><li><div>'); content.push('<p>'+obj.section_number +' '+ obj.title+'</p>'); content.push('</div></li></ul>'); }//end for each loop }//end if //for chapter3 ends //for chapter4 starts if( data.item.chapter[4] && data.item.chapter[4].length>=1){ for(i=0;i<data.item.chapter[4].length;i++){ var obj = data.item.chapter[4]; if(data.item.chapter[4].chapter_row==0){ content.push('<h3>Chapter 21 Existing Ambulatory Health Care Occupancy</h3>'); } content.push('<ul><li><div>'); content.push('<p>'+obj.section_number +' '+ obj.title+'</p>'); content.push('</div></li></ul>'); }//end for each loop }//end if //for chapter4 ends //for chapter5 starts if( data.item.chapter[5] && data.item.chapter[5].length>=1){ for(i=0;i<data.item.chapter[5].length;i++){ var obj = data.item.chapter[5]; if(data.item.chapter[5].chapter_row==0){ content.push('<h3>Chapter 32 New Residential Board and Care</h3>'); } content.push('<ul><li><div>'); content.push('<p>'+obj.section_number +' '+ obj.title+'</p>'); content.push('</div></li></ul>'); }//end for each loop }//end if //for chapter5 ends //for chapter6 starts if( data.item.chapter[6] && data.item.chapter[6].length>=1){ for(i=0;i<data.item.chapter[6].length;i++){ var obj = data.item.chapter[6]; if(data.item.chapter[6].chapter_row==0){ content.push('<h3>Chapter 33 Existing Residential Board and Care</h3>'); } content.push('<ul><li><div>'); content.push('<p>'+obj.section_number +' '+ obj.title+'</p>'); content.push('</div></li></ul>'); }//end for each loop }//end if //for chapter6 ends //for chapter7 starts if( data.item.chapter[7] && data.item.chapter[7].length>=1){ for(i=0;i<data.item.chapter[7].length;i++){ var obj = data.item.chapter[7]; if(data.item.chapter[7].chapter_row==0){ content.push('<h3>Chapter 18 New Health Care Occupancies</h3>'); } content.push('<ul><li><div>'); content.push('<p>'+obj.section_number +' '+ obj.title+'</p>'); content.push('</div></li></ul>'); }//end for each loop }//end if //for chapter7 ends //for chapter8 starts if( data.item.chapter[8] && data.item.chapter[8].length>=1){ for(i=0;i<data.item.chapter[8].length;i++){ var obj = data.item.chapter[8]; if(data.item.chapter[8].chapter_row==0){ content.push('<h3>Chapter 19 Existing Health Care Occupancies</h3>'); } content.push('<ul><li><div>'); content.push('<p>'+obj.section_number +' '+ obj.title+'</p>'); content.push('</div></li></ul>'); }//end for each loop }//end if //for chapter8 ends //for chapter9 starts if( data.item.chapter[9] && data.item.chapter[9].length>=1){ for(i=0;i<data.item.chapter[9].length;i++){ var obj = data.item.chapter[9]; if(data.item.chapter[9].chapter_row==0){ content.push('<h3>Chapter 20 New Amulatory Health Care Occupancies</h3>'); } content.push('<ul><li><div>'); content.push('<p>'+obj.section_number +' '+ obj.title+'</p>'); content.push('</div></li></ul>'); }//end for each loop }//end if //for chapter9 ends //for chapter10 starts if( data.item.chapter[10] && data.item.chapter[10].length>=1){ for(i=0;i<data.item.chapter[10].length;i++){ var obj = data.item.chapter[10]; if(data.item.chapter[10].chapter_row==0){ content.push('<h3>Chapter 21 Existing Amulatory Health Care Occupancies</h3>'); } content.push('<ul><li><div>'); content.push('<p>'+obj.section_number +' '+ obj.title+'</p>'); content.push('</div></li></ul>'); }//end for each loop }//end if //for chapter10 ends //for chapter11 starts if( data.item.chapter[11] && data.item.chapter[11].length>=1){ for(i=0;i<data.item.chapter[11].length;i++){ var obj = data.item.chapter[11]; if(data.item.chapter[11].chapter_row==0){ content.push('<h3>Chapter 32 New Residential board</h3>'); } content.push('<ul><li><div>'); content.push('<p>'+obj.section_number +' '+ obj.title+'</p>'); content.push('</div></li></ul>'); }//end for each loop }//end if //for chapter11 ends //for chapter12 starts if( data.item.chapter[12] && data.item.chapter[12].length>=1){ for(i=0;i<data.item.chapter[12].length;i++){ var obj = data.item.chapter[12]; if(data.item.chapter[12].chapter_row==0){ content.push('<h3>Chapter 33 Existing Residential board</h3>'); } content.push('<ul><li><div>'); content.push('<p>'+obj.section_number +' '+ obj.title+'</p>'); content.push('</div></li></ul>'); }//end for each loop }//end if //for chapter12 ends //}//end k loop }//if condition ends else { content.push('<ul><li><div>'); content.push('<p>No records found.</p>'); content.push('</div></li></ul>'); } $('#advanced_search_display').html(content.join('')); $('#filter').css("display","none") ; $('#active_filters').css("display","none"); }}); }//end function \[/code\]
How to load gif image while ajax content is loading and javascript
- Thread starter Billf210
- Start date