Level 3
@daniel1836 Can you provide your code?
I'm guessing there is no element in the DOM with the same ID in your other files
Apr 27, 2021
11
Level 6
Issue with jQuery (Can't find element in DOM by ID)
I know jQuery isn't the most popular.
But I have an issue, where jQuery receives form data through an ID, and passes it through AJAX to my PHP.
My code works as it's supposed to. But when I access the same function (through different files) (because I have to repeat the same functionality in my project from a different location), it cannot find the same ID.
I am confused because nothing is changed. My only guess is the DOM is different. But the flow of the code through JavaScript and PHP functions is exactly the same.
Can anyone fill me in on jQuery as it pertains to my situation? I am still new with it.
Thanks
Level 6
The issue isn't so much with the code. Like I said. The code does what it's supposed to from one file. And can't find the same ID from another file.
I was thinking it had to do with the DOM too, but both instances land in the same function (which has the same DOM).
I suppose the relevant code would be this:
var data = $("#edit").serialize();
xmlhttp.send(data);
<form id="edit" class="text-center" method="POST">
<input>...</input>
</form
$id = trim(mysqli_real_escape_string($connection, $_POST['id']));
$name = trim(mysqli_real_escape_string($connection, $_POST['name']));
In one file the HTTP fetches work, in another, the ID of the form isn't found I presume, and the fetches don't work.
Level 75
Can't find element in DOM by ID
That's pretty obvious.
Level 6
It is obvious, but I'm confused about scope with jQuery. The only difference with the working/non-working is that the HTML button is in a different file. The destinations, parameters are the same.
Level 75
What do you get if you var_dump($_POST);
I would suggest using PDO.
1 like
Level 75
And it doesn't have same value in attribute id.
1 like
Level 6
That issue is resolved. Thanks jlrdw for teaching me something!
I'm trying to get data-id value from:
<button data-id="<?php echo $division_id; ?>" data-target="#confirm-delete">Delete</button>
Here is my jQuery.
$('#confirm-delete').on('show.bs.modal', function (event) {
var id = $(event.relatedTarget).data('id');
$(this).find("#entryId").val(id);
});
And I'm trying to capture it in a modal:
<input id="entryId" name="entryId" type="hidden" value="">
It isn't working due to ID issues, similar to my old issue. How can I alter the code so it finds the ID value? Or at least explain to me what's going on in the jQuery, with the id part.
Level 6
I don't understand how they don't have the same ID attribute. I have code like this:
$('#updateScoreModal').on('show.bs.modal', function (event) {
var gameId = $(event.relatedTarget).data('game-id');
$(this).find("#gameId").val(gameId);
var homeTeamName = $(event.relatedTarget).data('home-name');
$(this).find("#homeTeamLabel").text(homeTeamName);
var awayTeamName = $(event.relatedTarget).data('away-name');
$(this).find("#awayTeamLabel").text(awayTeamName);
});
It works in one file of my code but not in another. And it's weird because the Bootstrap modal ID is the same on show. All the data id targets are the same. But in one file they fetch correctly and in another they are empty strings.
Level 75
1 like
Level 6
I'm not sure I understand the code in that thread. I want to know how data-id value becomes equated with entryID, and if it's possible to modify the jQuery/HTML to add a new target that will find my new ID Modal.
Level 75
Go here https://api.jquery.com/ their documentation has examples of all methods. Also check to see if YouTube has a good tutorial you can take. You need to practice various techniques and actually learn some jQuery and how it all works.
Also it seems your new question was about a modal so maybe start a new post.
Also when working with javascript and ajax use your network tab to help troubleshoot problems.
1 like
Please or to participate in this conversation.