-3

I am having trouble with passing multiple variables into on jQuery function (jQuery v3.6.1)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>

function takeId(newButtonId, startTime, endTime, date, note){

    $('#myModal').modal('show');
    try {
        $('#bookingIdHidden').attr('value', newButtonId);
        $('#timeStart').attr('value', startTime);
        $('#timeEnd').attr('value', endTime);
        $('#date').attr('value', date);
        $('#note').attr('value', note);
    } catch(err) {
        alert(err); 
    }


};

For some reason this does not work (function does not run at all), however it does work when I only pass in one value and only set the value of #bookingIdHidden

This function is called using onclick() from a button, here:

<input type='button' name='edit' value='Edit' onclick="takeId($newButtonId, $startTime, $endTime, $date, $note);" id='1'>

Echo Version

echo "<td>" . "<input type='button' name='edit' value='Edit' onclick='takeId($newButtonId, $startTime, $endTime, $date, $note)' id='1'>" . "</td>"; 

<input type="button" name="edit" value="Edit" onclick="takeId(1," 06:00:00.0000,="" 07:00:00.0000,="" 2023-01-05,="" ,="" 0)="" id="1">

Would anyone know why?

All help will be much appreciated

BUR073
  • 1
  • 4
  • 2
    Note that you have newButtonId twice in the function definition, making it accept 6 arguments and passing 5. What gets assigned to newButtonId when you pass two arguments ... probably $startTime – Maxim Krizhanovsky Jan 11 '23 at 20:34
  • Thanks, I didn't notice that! However, unfortunately the result is the same – BUR073 Jan 11 '23 at 20:35
  • Also, in your onclick event, the input button is not closed properly. It should be `` – Tivi Jan 11 '23 at 20:36
  • Do you actually intend to set the value attribute rather than the value property? it's not usually useful to do so, unless you actually wanted to update the default value. – Kevin B Jan 11 '23 at 20:36
  • You are opening and ```input``` and you are closing a ```button``` and you didn't put the function inside quotes. – Joan Lara Jan 11 '23 at 20:36
  • Jquery 5.2.3? did you mean 3.2.3? or am i really that far out of the loop on jquery – Kevin B Jan 11 '23 at 20:38
  • I do intend to set the value of the input, it will act as a placeholder but if the user decides not to change it the original value can still be passed to the backend. I have updated my input to Tivi's suggestion, unfortunately it is still not working – BUR073 Jan 11 '23 at 20:42
  • How are `$newButtonId` etc all defined? Are they really JS variables, or are you trying to use PHP variables there? First step of debugging would be to check your variables, are they all what you expect? Are you perhaps forgetting to ``, etc? https://stackoverflow.com/questions/23740548/how-do-i-pass-variables-and-data-from-php-to-javascript – Don't Panic Jan 11 '23 at 20:59
  • Hi, Don't Panic. They are php variables, they are taken from the result of an sql query, these variables are then put into a table using a while loop along with the buttons on the side. My method works completely fine for just the php var being inputted into the jQuery function, however, not so fine with more – BUR073 Jan 11 '23 at 21:05
  • Do you `echo` that button in PHP? Is that javascript code inside a `.php` file? Are there any "special" characters in your PHP variables? Have you tried using quotes? `onclick="takeId('$newButtonId', '$startTime', '$endTime', '$date', '$note')`? – brombeer Jan 11 '23 at 21:08
  • Yes, I do echo the button inside a .php file and I shall give the quotes a try right now, thanks. Update: No luck – BUR073 Jan 11 '23 at 21:10
  • Can you post the `echo` you use to print out that button? There's `"` and `'` quotes inside that "string", one of those should be escaped. Do you have error reporting turned on? – brombeer Jan 11 '23 at 21:12
  • There we go, have done – BUR073 Jan 11 '23 at 21:14
  • The code you have shown does not echo anything. Please edit your question,show us your real code. Have you checked the actual rendered output in the browser source? – Don't Panic Jan 11 '23 at 21:14
  • The rendered output is fine, would you like a screenshot? More than happy to provide one. I can also provide the code for the whole table, if you would like – BUR073 Jan 11 '23 at 21:16
  • I mean the HTML - if you're going to share it pls do it as text, like the rest of your code. [Here's a simplified version of your code](https://jsfiddle.net/dont_panic/p97z3rg1/) which works fine. – Don't Panic Jan 11 '23 at 21:24
  • It looks like your variables are not quoted? If they are strings they need to be. – Don't Panic Jan 11 '23 at 21:28
  • Which section of HTML would you like, table or modal or both? While your code does indeed work in jsFiddle, it doesn't for me inside the php echo statement (off course with " changed to ') – BUR073 Jan 11 '23 at 21:31
  • Only the code we're looking at ... ? ` – Don't Panic Jan 11 '23 at 21:33
  • Ok cool, I have added the code as it stands currently, to the bottom of my question for you – BUR073 Jan 11 '23 at 21:36
  • We need to see the **HTML** of a single button that is not working, the first one if none of them work. The rendered HTML that your browser gets. Not the PHP. If you use your browser's devtools, or view source, you will see what HTML that PHP generates. That is what the browser and Javascript are processing, and that is the part that is not working. – Don't Panic Jan 11 '23 at 21:42
  • Ah ok, I understand what you mean. Will add it now – BUR073 Jan 11 '23 at 21:45
  • I am not sure where the =, is coming from. I echoed the var $startTime and there were no =, – BUR073 Jan 11 '23 at 21:48
  • You can see the qoutes and code is all messed up in the code you've added. I updated [my JSfiddle](https://jsfiddle.net/dont_panic/p97z3rg1/) to show your code isn't working - open your browser devtools and check the console, you will see `Uncaught SyntaxError: Unexpected end of input (at (index):33:144)`. – Don't Panic Jan 11 '23 at 21:49
  • The error I am receiving is SyntaxError: Unexpected token '}' and it points the line which contains echo "";
     – BUR073 Jan 11 '23 at 22:09
  • It is working now! It needed ` around the variable names and ' around the function call after onclick. Your help has been very much appreciated – BUR073 Jan 11 '23 at 22:21
  • Use your browser devtools when developing, you will see the errors caused by syntax errors: https://developer.mozilla.org/en-US/docs/Learn/Common_questions/What_are_browser_developer_tools – Don't Panic Jan 11 '23 at 22:24
  • I shall make sure to do that, it has been very helpful. Once again, thank you for your help – BUR073 Jan 11 '23 at 22:29

1 Answers1

0

First of all you are passing extra parameter while calling a function. Remove extra parameters and try. If it is still not work then try below solution

Pass parameters to function in single quotes like given below code snippet.

<input type="button" name="edit" value="Edit" onclick="takeId(1, '06:00:00.0000', '07:00:00.0000', '2023-01-05', '') id="1">
Shahzaib Saleem
  • 23
  • 4