CODEWITHSUNDEEP
javascriptajaxgoogle-chromejquery
Badea Sorin
Badea Sorin

Reputation: 174

jQuery ajax doesn't work with last version of chrome

Hey guys, I have a little problem with a simple ajax request. I can't figure it out why jquery ajax method doesn't work with the last version of chrome ... on ff work great so as on opera but on chrome i don't get any response and no errors. This is my js code:

function load(idno){
    var url = 'index.php';
    $.get(
        url,
        {
            pagina:"ajax",
            show:"cars",
            brand:idno
        },
        function(data) { document.getElementById("model").innerHTML=data },
        "html"
    );
}

Upvotes: 2

Views: 2155

Answers (3)

Yogesh Prajapati
Yogesh Prajapati

Reputation: 4870

because of Security reason chrome not allow cross-domain communication if request is not from a trusted sites, if you want to use $.ajax in chrome so you need to disbale web security of chrome use this comman.

your_chrome_path --disable-web-security

after doing this $.ajax works fine.

Upvotes: 0

Badea Sorin
Badea Sorin

Reputation: 174

After a long long nith I've managed to resolve the problem. My JS code is good and maybe Phil's too ... I didn't try that in this version but the real problem in Chrome is that onclick attributes on option tags aren't allowed. So I made the event

<select onchange='loadData(this.value,'models')'></select>

and it is working great. Thank you Phil anyway.

Upvotes: 0

Phil
Phil

Reputation: 165059

Any reason you're not just using jQuery.load()? Eg

$('#model').load('index.php', {
    pagina: 'ajax',
    show: 'cars',
    brand: idno
});

At a guess, I'd say the problem is with the innerHTML call. A more robust method would be to use jQuery.html(), eg

function(data) { $('#model').html(data); }

Edit

Just whipped up this test and it works fine

<?php
// test.php
echo '<pre>', print_r($_REQUEST, true), '</pre>';

<!-- test.html -->
<!DOCTYPE html>
<html>
  <head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  </head>
  <body>
      <div id="model">
          Default text
      </div>
      <p><button id="fetch-data">Fetch Data</button></p>
      <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js"></script>
      <script type="text/javascript">
          jQuery(function($) {
              $('#fetch-data').click(function() {
                  $('#model').load('test.php', {
                      pagina: 'ajax',
                      show: 'cars',
                      brand: 123
                  });
                  return false;
              });
          });
      </script>
  </body>
</html>

When I click the button, I can see all the request variables sent to the script

Upvotes: 3

Related Questions