How can I refer to the shopping cart using document.getElementById if it does not have an id?
I am trying to get the id for the drupal shopping cart widget so that I can refer to it within javascript. When I look at the shopping cart div within firebug (see below) it only lists the class and not the id and I tried referring to the class like it was the id but it was not recognized (i.e. drupal_add_js('alert(document.getElementById("panel-pane pane-block pane-uc-cart-0").value)','inline'); ). <div class="panel-pane pane-block pane-uc-cart-0"> How can I refer to the shopping cart using document.getElementById if it does not have an id? -- John J. Mitchell
jQuery ships with Drupal. Use class-based selectors http://api.jquery.com/category/selectors/ alert($(".pane-uc-cart-0").html()); However, if you are adding JS 'inline' it is added to the <head> which executes before the rest of the DOM is loaded and so you won't get any response. Use $(document).ready(function(){ ... }); or Drupal.behaviors.foo = function() { ... } instead, or simply add it to the footer. On Fri, Jan 28, 2011 at 9:34 AM, John Mitchell <mitchelljj98@gmail.com>wrote:
I am trying to get the id for the drupal shopping cart widget so that I can refer to it within javascript. When I look at the shopping cart div within firebug (see below) it only lists the class and not the id and I tried referring to the class like it was the id but it was not recognized (i.e. drupal_add_js('alert(document.getElementById("panel-pane pane-block pane-uc-cart-0").value)','inline'); ).
<div class="panel-pane pane-block pane-uc-cart-0">
How can I refer to the shopping cart using document.getElementById if it does not have an id?
-- John J. Mitchell
I tried all 3 of the previous email suggestions in order get access to DOM objects within my .js file: a.) Drupal behaviors: i.e. Drupal.behaviors.foo = function() {alert($(".pane-uc-cart-0").html());}; b.) $(document).ready: i.e. $(document).ready(function(){alert($(".pane-uc-cart-0").html());}); c.) By adding the .js file to the footer instead of the default of header: i.e. drupal_add_js(drupal_get_path('module', 'product_type') . '/js/shopping_cart_info.js', 'module', 'footer'); and then calling the alert statement within the .js file like was already done within the "A" and "B" examples: i.e. alert($(".pane-uc-cart-0").html()); After clicking the "add to cart" link (i.e. https://mydomain/cart/add/p110_a2o09-24-100-001) then hook_cart_item is executed which includes the .js file which is executed which does a number of things including calling the alert statement. For all three of the above the alert statement was not even executed. If I just added the .js file to the header like I had done previously then the alert statement executes but it returns null. In looking at firebug within firefox I noticed that both https://mydomain/cart/add/p110_a2o09-24-100-001 and https://mydomain/cartrequests completed but all the other ones after that did not complete (i.e. https://mydomain/modules/node/node.css?x). So I guess because these other requests never completed which means that the rest of the DOM never loaded. So if the .js file is at the footer or waiting for the DOM to complete the alert statement would not execute. Is their any way that I can get these requests to complete? Thanks, John On Fri, Jan 28, 2011 at 12:15 PM, Carl Wiedemann <carl.wiedemann@gmail.com>wrote:
jQuery ships with Drupal. Use class-based selectors http://api.jquery.com/category/selectors/
alert($(".pane-uc-cart-0").html());
However, if you are adding JS 'inline' it is added to the <head> which executes before the rest of the DOM is loaded and so you won't get any response. Use $(document).ready(function(){ ... }); or Drupal.behaviors.foo = function() { ... } instead, or simply add it to the footer.
On Fri, Jan 28, 2011 at 9:34 AM, John Mitchell <mitchelljj98@gmail.com>wrote:
I am trying to get the id for the drupal shopping cart widget so that I can refer to it within javascript. When I look at the shopping cart div within firebug (see below) it only lists the class and not the id and I tried referring to the class like it was the id but it was not recognized (i.e. drupal_add_js('alert(document.getElementById("panel-pane pane-block pane-uc-cart-0").value)','inline'); ).
<div class="panel-pane pane-block pane-uc-cart-0">
How can I refer to the shopping cart using document.getElementById if it does not have an id?
-- John J. Mitchell
-- John J. Mitchell
Do you have any JS errors in your firebug console? What do you mean by "all the other ones after that did not complete?" Your CSS files aren't loading? If you are aggregating JS or CSS you will need to clear the Drupal cache. Make sure to hold shift and click refresh in your browser such that you aren't caching JS or CSS in your browser either. On Mon, Jan 31, 2011 at 5:01 PM, John Mitchell <mitchelljj98@gmail.com>wrote:
I tried all 3 of the previous email suggestions in order get access to DOM objects within my .js file:
a.) Drupal behaviors: i.e. Drupal.behaviors.foo = function() {alert($(".pane-uc-cart-0").html());}; b.) $(document).ready: i.e. $(document).ready(function(){alert($(".pane-uc-cart-0").html());});
c.) By adding the .js file to the footer instead of the default of header: i.e. drupal_add_js(drupal_get_path('module', 'product_type') . '/js/shopping_cart_info.js', 'module', 'footer'); and then calling the alert statement within the .js file like was already done within the "A" and "B" examples: i.e. alert($(".pane-uc-cart-0").html());
After clicking the "add to cart" link (i.e. https://mydomain/cart/add/p110_a2o09-24-100-001) then hook_cart_item is executed which includes the .js file which is executed which does a number of things including calling the alert statement. For all three of the above the alert statement was not even executed. If I just added the .js file to the header like I had done previously then the alert statement executes but it returns null. In looking at firebug within firefox I noticed that both https://mydomain/cart/add/p110_a2o09-24-100-001 and https://mydomain/cartrequests completed but all the other ones after that did not complete (i.e. https://mydomain/modules/node/node.css?x). So I guess because these other requests never completed which means that the rest of the DOM never loaded. So if the .js file is at the footer or waiting for the DOM to complete the alert statement would not execute.
Is their any way that I can get these requests to complete?
Thanks,
John
On Fri, Jan 28, 2011 at 12:15 PM, Carl Wiedemann <carl.wiedemann@gmail.com
wrote:
jQuery ships with Drupal. Use class-based selectors http://api.jquery.com/category/selectors/
alert($(".pane-uc-cart-0").html());
However, if you are adding JS 'inline' it is added to the <head> which executes before the rest of the DOM is loaded and so you won't get any response. Use $(document).ready(function(){ ... }); or Drupal.behaviors.foo = function() { ... } instead, or simply add it to the footer.
On Fri, Jan 28, 2011 at 9:34 AM, John Mitchell <mitchelljj98@gmail.com>wrote:
I am trying to get the id for the drupal shopping cart widget so that I can refer to it within javascript. When I look at the shopping cart div within firebug (see below) it only lists the class and not the id and I tried referring to the class like it was the id but it was not recognized (i.e. drupal_add_js('alert(document.getElementById("panel-pane pane-block pane-uc-cart-0").value)','inline'); ).
<div class="panel-pane pane-block pane-uc-cart-0">
How can I refer to the shopping cart using document.getElementById if it does not have an id?
-- John J. Mitchell
-- John J. Mitchell
Regarding the below email: No I don't have any JS errors in my firebug console. I am not aggregating my JS or CSS. Yes my CSS files aren't loading. Keep in mind that I have an iframe within my drupal page which is not drupal and is on another domain. The user clicks an "Add to Cart" link within this iframe which points to the parent drupal domain in order to do the "add to cart" update and the target within the link is target = "_hidden" so that the page is not refreshed. Everything works in that the page does not get refreshed and an item is added to the cart but you can't see the cart number and cart total refresh within the browser. I already have a way of updating these two objects via ajax but the problem is that DOM is never loaded so that even if I have the values to put in (based on an ajax request) these objects since they have not been loaded they can't be updated. Other than doing page refresh which I don't want to do. Does anyone have any suggestions? Thanks, John On Mon, Jan 31, 2011 at 7:34 PM, Carl Wiedemann <carl.wiedemann@gmail.com>wrote:
Do you have any JS errors in your firebug console?
What do you mean by "all the other ones after that did not complete?" Your CSS files aren't loading?
If you are aggregating JS or CSS you will need to clear the Drupal cache. Make sure to hold shift and click refresh in your browser such that you aren't caching JS or CSS in your browser either.
On Mon, Jan 31, 2011 at 5:01 PM, John Mitchell <mitchelljj98@gmail.com>wrote:
I tried all 3 of the previous email suggestions in order get access to DOM objects within my .js file:
a.) Drupal behaviors: i.e. Drupal.behaviors.foo = function() {alert($(".pane-uc-cart-0").html());}; b.) $(document).ready: i.e. $(document).ready(function(){alert($(".pane-uc-cart-0").html());});
c.) By adding the .js file to the footer instead of the default of header: i.e. drupal_add_js(drupal_get_path('module', 'product_type') . '/js/shopping_cart_info.js', 'module', 'footer'); and then calling the alert statement within the .js file like was already done within the "A" and "B" examples: i.e. alert($(".pane-uc-cart-0").html());
After clicking the "add to cart" link (i.e. https://mydomain/cart/add/p110_a2o09-24-100-001) then hook_cart_item is executed which includes the .js file which is executed which does a number of things including calling the alert statement. For all three of the above the alert statement was not even executed. If I just added the .js file to the header like I had done previously then the alert statement executes but it returns null. In looking at firebug within firefox I noticed that both https://mydomain/cart/add/p110_a2o09-24-100-001 and https://mydomain/cartrequests completed but all the other ones after that did not complete (i.e. https://mydomain/modules/node/node.css?x). So I guess because these other requests never completed which means that the rest of the DOM never loaded. So if the .js file is at the footer or waiting for the DOM to complete the alert statement would not execute.
Is their any way that I can get these requests to complete?
Thanks,
John
On Fri, Jan 28, 2011 at 12:15 PM, Carl Wiedemann < carl.wiedemann@gmail.com> wrote:
jQuery ships with Drupal. Use class-based selectors http://api.jquery.com/category/selectors/
alert($(".pane-uc-cart-0").html());
However, if you are adding JS 'inline' it is added to the <head> which executes before the rest of the DOM is loaded and so you won't get any response. Use $(document).ready(function(){ ... }); or Drupal.behaviors.foo = function() { ... } instead, or simply add it to the footer.
On Fri, Jan 28, 2011 at 9:34 AM, John Mitchell <mitchelljj98@gmail.com>wrote:
I am trying to get the id for the drupal shopping cart widget so that I can refer to it within javascript. When I look at the shopping cart div within firebug (see below) it only lists the class and not the id and I tried referring to the class like it was the id but it was not recognized (i.e. drupal_add_js('alert(document.getElementById("panel-pane pane-block pane-uc-cart-0").value)','inline'); ).
<div class="panel-pane pane-block pane-uc-cart-0">
How can I refer to the shopping cart using document.getElementById if it does not have an id?
-- John J. Mitchell
-- John J. Mitchell
-- John J. Mitchell
Keep in mind that I have an iframe within my drupal page which is not drupal and is on another domain.
It sounds like your problems could be related to JS cross-domain policy. You will probably have to do some sort of AJAX polling on the primary domain. See http://softwareas.com/cross-domain-communication-with-iframes for other techniques. On Wed, Feb 2, 2011 at 3:48 PM, John Mitchell <mitchelljj98@gmail.com>wrote:
Regarding the below email:
No I don't have any JS errors in my firebug console. I am not aggregating my JS or CSS. Yes my CSS files aren't loading. Keep in mind that I have an iframe within my drupal page which is not drupal and is on another domain. The user clicks an "Add to Cart" link within this iframe which points to the parent drupal domain in order to do the "add to cart" update and the target within the link is target = "_hidden" so that the page is not refreshed. Everything works in that the page does not get refreshed and an item is added to the cart but you can't see the cart number and cart total refresh within the browser. I already have a way of updating these two objects via ajax but the problem is that DOM is never loaded so that even if I have the values to put in (based on an ajax request) these objects since they have not been loaded they can't be updated.
Other than doing page refresh which I don't want to do. Does anyone have any suggestions?
Thanks,
John
On Mon, Jan 31, 2011 at 7:34 PM, Carl Wiedemann <carl.wiedemann@gmail.com>wrote:
Do you have any JS errors in your firebug console?
What do you mean by "all the other ones after that did not complete?" Your CSS files aren't loading?
If you are aggregating JS or CSS you will need to clear the Drupal cache. Make sure to hold shift and click refresh in your browser such that you aren't caching JS or CSS in your browser either.
On Mon, Jan 31, 2011 at 5:01 PM, John Mitchell <mitchelljj98@gmail.com>wrote:
I tried all 3 of the previous email suggestions in order get access to DOM objects within my .js file:
a.) Drupal behaviors: i.e. Drupal.behaviors.foo = function() {alert($(".pane-uc-cart-0").html());}; b.) $(document).ready: i.e. $(document).ready(function(){alert($(".pane-uc-cart-0").html());});
c.) By adding the .js file to the footer instead of the default of header: i.e. drupal_add_js(drupal_get_path('module', 'product_type') . '/js/shopping_cart_info.js', 'module', 'footer'); and then calling the alert statement within the .js file like was already done within the "A" and "B" examples: i.e. alert($(".pane-uc-cart-0").html());
After clicking the "add to cart" link (i.e. https://mydomain/cart/add/p110_a2o09-24-100-001) then hook_cart_item is executed which includes the .js file which is executed which does a number of things including calling the alert statement. For all three of the above the alert statement was not even executed. If I just added the .js file to the header like I had done previously then the alert statement executes but it returns null. In looking at firebug within firefox I noticed that both https://mydomain/cart/add/p110_a2o09-24-100-001 and https://mydomain/cart requests completed but all the other ones after that did not complete (i.e. https://mydomain/modules/node/node.css?x). So I guess because these other requests never completed which means that the rest of the DOM never loaded. So if the .js file is at the footer or waiting for the DOM to complete the alert statement would not execute.
Is their any way that I can get these requests to complete?
Thanks,
John
On Fri, Jan 28, 2011 at 12:15 PM, Carl Wiedemann < carl.wiedemann@gmail.com> wrote:
jQuery ships with Drupal. Use class-based selectors http://api.jquery.com/category/selectors/
alert($(".pane-uc-cart-0").html());
However, if you are adding JS 'inline' it is added to the <head> which executes before the rest of the DOM is loaded and so you won't get any response. Use $(document).ready(function(){ ... }); or Drupal.behaviors.foo = function() { ... } instead, or simply add it to the footer.
On Fri, Jan 28, 2011 at 9:34 AM, John Mitchell <mitchelljj98@gmail.com>wrote:
I am trying to get the id for the drupal shopping cart widget so that I can refer to it within javascript. When I look at the shopping cart div within firebug (see below) it only lists the class and not the id and I tried referring to the class like it was the id but it was not recognized (i.e. drupal_add_js('alert(document.getElementById("panel-pane pane-block pane-uc-cart-0").value)','inline'); ).
<div class="panel-pane pane-block pane-uc-cart-0">
How can I refer to the shopping cart using document.getElementById if it does not have an id?
-- John J. Mitchell
-- John J. Mitchell
-- John J. Mitchell
participants (2)
-
Carl Wiedemann -
John Mitchell