title: Double Quotes Break HTML Attributes and JS
body: <p>So I have some ajax requests that pull data from our product pages. These product pages can have a <strong>"</strong> <em>(double quote)</em> in their URL somewhere. This is a necessary evil, I'd explain why, but please just accept that I have to keep the double quotes in these URLs.</p>
  
  <p>In a nutshell, I am pulling stuff from an Excel XML file, then conducting ajax requests with Javascript/jQuery that pull text and data from "Product Pages" and then displaying that stuff on a "Product Listings" page. Again, the URLs of these "Product Pages" sometimes have double quotes in them.</p>
  
  <p>Moving on, these ajax requests are called via a function and the data obtained is returned and utilized by a callback. These functions have worked great until recently when we discovered that <strong>"</strong> <em>(double quotes)</em> are breaking the functions. These double quotes are being passed in the <strong>url</strong> variable to these AJAX requests. I have read a bunch of other posts mentioning quotes breaking their scripts, but many have found solutions, and I have not been able to.</p>
  
  <p>I even tried <code>var href = encodeURI( $(this).text() );</code> and <code>var href = encodeURIComponent( $(this).text() );</code>. These don't seem to fix the issue. Before I go on, let me show you my script.</p>
  
  <p><strong>XML</strong></p>
  
  <pre><code>&lt;Worksheet ss:Name="Recommended"&gt;
  &lt;Table ss:ExpandedColumnCount="1" ss:ExpandedRowCount="5" x:FullColumns="1"
   x:FullRows="1" ss:DefaultRowHeight="15"&gt;
   &lt;Column ss:AutoFitWidth="0" ss:Width="96.75"/&gt;
   &lt;Row ss:AutoFitHeight="0"&gt;
    &lt;Cell&gt;&lt;Data ss:Type="String"&gt;/2U-12&amp;quot;-Economy-Rack-Shelf-KH-3000100202/&lt;/Data&gt;&lt;/Cell&gt;
   &lt;/Row&gt;
  &lt;/Table&gt;
  &lt;/Worksheet&gt;
  </code></pre>
  
  <p><strong><em>JS</em></strong></p>
  
  <pre><code>$(this).find('Data').each(function(){
  
    var href = $(this).text();
  
    // This is where the 'url' is getting it's value from the 'href' variable
    // that is being pulled from the XML file 'Data'
    getProductData('name', href, function(val) {
  
      console.log(val);
  
    });
  
  });
  
  // Get data from the product page anywhere (Global)
  function getProductData(type, url, callBack) {
  
    $.ajax({
      url: url,
      method: 'GET',
      dataType: 'html',
      success: function(data){
  
        var $data = $(data).find('#product-data');
  
        var val = $data.data(type);
  
        return callBack( val );
  
      },
      error: function(data) {
        console.error( 'getProductData: ' + type + ' = FAIL / URL: ' + url );
      }
    });
  
  }
  </code></pre>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;input type="hidden" id="product-data" data-name="{product['product_name']}"&gt;
  </code></pre>
  
  <p>Any ideas on how I can get these double quotes to work with my script? It seems there is very little on the subject available... I haven't had this issue in all my years in development :(</p>
  
  <p><strong><em>I just cannot get the quotes (that are actually coded as <code>&amp;quot;</code> in the XML file) to encode properly when the AJAX request uses this string as the url parameter...</em></strong></p>
  
  <p>The outcome of the above is my <strong><em>getProductData()</em></strong> simply does not return anything. This same function returns data just fine when the <strong>url</strong> variable does not contain double quotes in the string...</p>
  
  <p><strong>EDIT</strong></p>
  
  <p>I have also tried <code>var href = $(this).text().replace('"', '\"');</code> btw.</p>
  
  <p><strong>EDIT</strong> So I mis-diagnosed my issue. The AJAX requests were working, the values being returned were just corrupted by the quotes. So, the issue was that the quotes made attributes break apart in my HTML, the AJAX requests were doing okay.</p>
  
  <p>I am renaming the post to better label the issue I was having. Sometimes, it's the most basic things that break our stuff right?</p>