1

I have a joomla calendar set up:

        <?php
        defined('_JEXEC') or die;
        JHTML::_('behavior.calendar');
        echo '<div id="calendarBoxes"  >';
        echo '<div id="datereceived1" class="datereceived1" >';
        echo JHtml::calendar(date("d/m/Y"),'dateReceived','dateReceived' , '%d-%m-%Y');
        echo "</div>";

This works fine and shows the calendar which then populates the box correctly.

I need to get the populated value so that I can use it in an ajax call to save it to a database.

I'm doing this:

stock.datereceived = jQuery( "#dateReceived" ).val();

but this returns nothing.

I looked at the code inspector and I can see the value:

<input type="text" id="dateReceived" name="dateReceived" value="" data-alt-value="13-10-2019" autocomplete="off" data-local-value="13-10-2019">

but I can't access the data. I can't use

jQuery("#dateReceived).attr("data-alt-value");
jQuery("#dateReceived).val();

And I can't find any getter or setter for the calendar.

Any help would be great. thanks

Update 1

I've tried a few debug type things without success:

stock.datereceived = jQuery( "#dateReceived" ).val();
console.log("stock.datereceived is "+stock.datereceived);
console.log("getElementById is "+jQuery("dateReceived").attr("data-alt-value") );

which gives stock.datereceived is stock-lists:268 getElementById is undefined in the element inspector

  • So is this a matter of the jquery code being executed before the element is rendered? I mean, if you run your line of jquery code from your browser (when you can see the rendered element), are you able to access the value? console.log(jQuery("#dateReceived").val()); Are you able to get any actions (proof of life) from you javascript where you are writing it? console.log('proof of life in javascript'); How are you checking stock.datereceived to know it is empty? Sorry if these basic checks are insulting; my intention is to eliminate some possibilities. – mickmackusa Oct 13 at 22:09
  • I've looked at stock.datereceived = jQuery( "#dateReceived" ).val(); console.log("stock.datereceived is "+stock.datereceived);and it give shows no value in the element inspector. However if I look at the properties of the element and value it shows the correct value.@mickmackusa – user1616338 Oct 14 at 6:51
  • So is this a jQuery versus $ issue? console.log($("#dateReceived").val()); from your browser's dev tools. Are you declaring let stock = {}; before pushing the property? Are we able to get a url from you so that we can see for ourselves or is this application inaccessible to the public? – mickmackusa Oct 14 at 6:55
1

Here's the glaring issue that I can detect via Google Chrome's developer tools...

You have multiple instances of the element id (one nested inside another) that you are attempting to access. id attributes need to be unique on a document.

enter image description here


I strongly urge you to make the the necessary changes to make the id attributes unique before progressing with your application (this is not only a matter of writing good markup, it is a matter of stability as you're seeing first-hand the implications).

That said, you need to increase the specificity of your selector so that jQuery knows precisely which element you wish to access. Fortunately, the adjustment is super simple:

jQuery('input#dateReceived').val();

enter image description here

  • that work great. I did check for multiple instances of the dateReceived id. I ran ctrl u and then ran a test search but couldn't find any matching. There were plenty of dateReceived1 or dateReceived2. Anyways thanks this is really really helpful. :) – user1616338 Oct 14 at 8:07
  • Yes, I can confirm that checking the source code with ctrl+u and then ctrl+f to search will not reveal the redundant id. Tricky scenario for you to debug because the second element was generated/rendered by javascript on top of the source code. Even if you press f12, then ctrl+f, then search for "dateReceived", only the first id and name instances are highlighted by the browser tool. – mickmackusa Oct 14 at 8:14

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.