function fails in chrome + 1 other question

[richei]

Is there some reason why this function would work in firefox and ie, but not work at all in chrome?

function submit_info() {
 var data = $("#genit").serialize();
 
 $.ajax({
  url: 'inc/ajax_submit_iTpackage.php',
  data: data,
  type: "POST",
  cache: false,
  
  success: function(result) {
   $("#submit_suc").html(result);
  }
 });
 //$("#submit_suc").delay(3000).toggle('fast');
}

I only test in firefox since I like its developer tools, but the guy that was testing it for me uses chrome and was telling me he couldn't submit the information to the database, so I got on Skype and sure enough, it wasn't working at all, and then I tried it on my chrome and it wasn't working, its not even calling the function.

 

Thus is the button: <input type="button" value="Submit" onclick="submit_info()" />

 

second question.  I have a rather large amount of windows that have to opened and closed depending on the content being displayed (basically, each menu item has its own article to display in).  These 2 are from the function to make the article visible.

 $("#viewiT").click(function() {
  var tags = ['tickets','news','addnewuser','viewuser','post_news','view_login','view_albums','isales_merge_labels','trends_merge_labels','view_apps','switch_apps','get_itunes'];
  closetag(tags);
  closer('itunes_marketing', 'genitunes');
 });
 $("#geniT").click(function() {
  var tags = ['tickets','news','addnewuser','viewuser','post_news','view_login','view_albums','isales_merge_labels','trends_merge_labels','view_apps','switch_apps','itunes_marketing'];
  closetag(tags);
  closer('get_itunes', 'viewitunes');
 
 
function closetag(tag) {
  for(var i in tag) {
   if($("#"+tag[i]).not(':hidden')) {
    $("#"+tag[i]).hide();
   }
  }
 }

The other one actually loads the php page into the now visible window.

 

My question is this: is there a way to slim that down so I don't have to specify each of the main containers? i'm sure i'll be adding more content in there as we grow and add more services.  all it does is look to see what's visible and if it is, close it.  I'm sure there's a much simpler way of doing this.

Edited January 22, 2014 by richei

[gristoi]

try:

//change this
<input type="button" value="Submit" onclick="submit_info()" />

// to this
<a href="#" id="submitInfo">Submit</a>

// then your javascript
$(document).ready(function(){

$('#submitInfo').click(function(e){

   e.preventDefault();
   var data = $('#genit').serialize();
    ..............
   // your ajax call here
});
});

modern javascript should be event driven, s you shouldnt be polluting your html with stuff like onclick=... etc.

[richei]

If I use this

$(document).ready(function() {
 $('#submitInfo').click(function(e){
  e.preventDefault();
  var data = $('#genit').serialize();
 
  $.ajax({
   url: 'inc/ajax_submit_iTpackage.php',
   data: data,
   type: "POST",
   cache: false,
  
   success: function(result) {
    $("#submit_suc").html(result);
   }
  });
 });
}

The page doesn't up at all, all I get is the progress indicator, did I miss something somewhere?

Edited January 22, 2014 by richei