如何在while循环内获取唯一的ID。

huangapple
go评论90阅读模式
英文:

How to get unique Ids within while-loop

问题

I have a form within a while-loop and am using javascript/ajax to make the db edits and post a success message. The only issue I have is with the success message. Since the Id is being repeated the success message displays beneath the first record returned, instead of beneath the record the user selected. How can I assign a unique Id to resolve this?

<div id="content-new">
    <?php    
    $sql_action = "SELECT movies.img, movies.title, movies.title_full, movies.new, my_list.title, my_list.username FROM movies LEFT JOIN my_list ON movies.title_full = my_list.title WHERE new != '' ORDER BY movies.id DESC LIMIT 16";
    $result_action = mysqli_query($db_connect, $sql_action) or die(mysqli_error($db_connect));
    while ($row_action = mysqli_fetch_assoc($result_action)) {
        $img = $row_action['img'];
        $title = $row_action['title'];
        $title_full = $row_action['title_full'];
        $new = $row_action['new'];
        $mylist = $row_action['username'];
        
        // CHECK IF FAV EXISTS MORE THAN ONCE IN DB
        $stmt_count_fav = $db_connect->prepare("SELECT title FROM my_list WHERE title = ?");
        $stmt_count_fav->bind_param("s", $title_full);
        $stmt_count_fav->execute();
        $stmt_count_fav->store_result();
        $stmt_count_fav->fetch();
        $count_fav = $stmt_count_fav->num_rows;
        $stmt_count_fav->close();
        ?>
        
        <div id="div_fav_hover" style="display: inline-block;">
            <?php if ($mylist != "") { // ON MY LIST ?>
                <div id="id_new_delete" style="display: inline-block;">
                    <form id="form-new" style="display: inline-block;" class="class_new_delete">
                        <input style="display: none;" type="text" name="title_home" value="<?php echo $title_full; ?>" />
                        <input style="display: none;" name="favorite_delete_home" value="favorite_delete_home" />
                        <input id="btn_mylist_on_home" style="margin-bottom: 10px; margin-left: -135px;" type="submit" name="btn_password" value="" class="class_fav_hover_on">
                    </form>
                </div>
            <?php } else { // NOT ON MY LIST OR ANOTHERS ?>
                <div id="id_new_add" style="display: inline-block;">
                    <form id="form-new" style="display: inline-block;" class="class_new_add">
                        <input style="display: none;" type="text" name="title_home" value="<?php echo $title_full; ?>" />
                        <input style="display: none;" name="favorite_home" value="favorite_home" />
                        <input id="btn_mylist_default_home" style="margin-bottom: 10px; margin-left: -135px;" type="submit" name="btn_password" value="" class="class_fav_hover_off">
                    </form>
                </div>
            <?php } ?>
        </div>
        
    <?php } // END LOOP ?>
    
    <script>
        $(function () {
            $('.class_new_add').submit('click', function (event) {
                event.preventDefault();
                $.ajax({
                    type: 'POST',
                    url: 'ajax/mylist.php',
                    data: $(this).serialize(),
                    success: function (data) {
                        $('#id_new_add').html("Added to My List");
                    }
                });
            });
        });
        
        $(function () {
            $('.class_new_delete').submit('click', function (event) {
                event.preventDefault();
                $.ajax({
                    type: 'POST',
                    url: 'ajax/mylist.php',
                    data: $(this).serialize(),
                    success: function (data) {
                        $('#id_new_delete').html("Removed from My List");
                    }
                });
            });
        });
    </script>
</div>

Here's an update. Please excuse my ignorance with JavaScript... Right now the success isn't displaying at all.

<div id="content-new">
    <?php    
    $sql_action = "SELECT movies.img, movies.title, movies.title_full, movies.new, my_list.title, my_list.username FROM movies LEFT JOIN my_list ON movies.title_full = my_list.title WHERE new != '' ORDER BY movies.id DESC LIMIT 16";
    $result_action = mysqli_query($db_connect, $sql_action) or die(mysqli_error($db_connect));
    while ($row_action = mysqli_fetch_assoc($result_action)) {
        $img = $row_action['img'];
        $title = $row_action['title'];
        $title_full = $row_action['title_full'];
        $new = $row_action['new'];
        $mylist = $row_action['username'];
        
        // CHECK IF FAV EXISTS MORE THAN ONCE IN DB
        $stmt_count_fav = $db_connect->prepare("SELECT title FROM my_list WHERE title = ?");
        $stmt_count_fav->bind_param("s", $title_full);
        $stmt_count_fav->execute();
        $stmt_count_fav->store_result();
        $stmt_count_fav->fetch();
        $count_fav = $stmt_count_fav->num_rows;
        $stmt_count_fav->close();
        ?>
        
        <div id="div_fav_hover" style="display: inline-block;">
            <?php if ($mylist == $username) { // IS A FAVORITE ?>
                <div class="div_new_delete" style="display: inline-block;">
                    <form id="form-new" style="display: inline-block;" class="class_new_delete">
                        <input style="display: none;" type="text" name="title_home" value="<?php echo $title_full; ?>" />
                        <input style="display: none;" name="favorite_delete_home" value="favorite_delete_home" />
                        <input id="btn_mylist_on_home" style="margin-bottom: 10px; margin-left: -135px;" type="submit" name="btn_password" value="" class="class_fav_hover_on">
                    </form>
                </div>
            <?php } else { // NOT A FAVORITE ?>
                <div class="div_new_add" style="display: inline-block;">
                    <form id="form-new" style="display: inline-block;" class="class_new_add">
                        <input style="display: none;" type="text" name="title_home" value="<?php echo $title_full; ?>" />
                        <input style="display: none;" name="favorite_home" value="favorite_home" />
                        <input id="btn_mylist_default_home" style="margin-bottom: 10px; margin-left: -135px;" type="submit" name="btn_password" value="" class="class_fav_hover_off">
                    </form>
                </div>
            <?php } ?>
        </div>
        
    <?php } // END LOOP ?>
    
    <script>
        $(function () {
            $('.class_new_add').submit('click', function (event) {
                let thisform = this;
                event.preventDefault();
                $.ajax({
                    type: 'POST

<details>
<summary>英文:</summary>

I have a form within a while-loop and am using javascript/ajax to make the db edits and post a success message. The only issue I have is with the success message. Since the Id is being repeated the success message displays beneath the first record returned, instead of beneath the record the user selected. How can I assign a unique Id to resolve this?


&lt;div id=&quot;content-new&quot;&gt;
&lt;?php	
$sql_action = &quot;SELECT movies.img, movies.title, movies.title_full, movies.new, my_list.title, my_list.username FROM movies LEFT JOIN my_list ON movies.title_full = my_list.title WHERE new != &#39;&#39; ORDER BY movies.id DESC LIMIT 16&quot;;
$result_action = mysqli_query( $db_connect, $sql_action )or die( mysqli_error( $db_connect ) );
while ( $row_action = mysqli_fetch_assoc( $result_action ) ) {
$img = $row_action[ &#39;img&#39; ];
$title = $row_action[ &#39;title&#39; ];
$title_full = $row_action[ &#39;title_full&#39; ];
$new = $row_action [ &#39;new&#39; ];
$mylist = $row_action[ &#39;username&#39; ];
// CHECK IF FAV EXISTS MORE THAN ONCE IN DB
$stmt_count_fav = $db_connect-&gt;prepare(&quot;SELECT title FROM my_list WHERE title = ?&quot;); 
$stmt_count_fav-&gt;bind_param(&quot;s&quot;, $title_full);
$stmt_count_fav -&gt; execute();
$stmt_count_fav -&gt; store_result();
$stmt_count_fav -&gt; fetch();
$count_fav = $stmt_count_fav-&gt;num_rows;
$stmt_count_fav-&gt;close();
?&gt;

<div id="div_fav_hover" style="display: inline-block;">
<?php if ( $mylist != "") { // ON MY LIST ?>
<div id="id_new_delete" style="display: inline-block;">
<form id="form-new" style="display: inline-block;" class="class_new_delete">
<input style="display: none" type="text" name="title_home" value="<?php echo $title_full; ?>" />
<input style="display: none" name="favorite_delete_home" value="favorite_delete_home" />
<input id="btn_mylist_on_home" style="margin-bottom: 10px; margin-left: -135px;" type="submit" name="btn_password" value="" class="class_fav_hover_on">
</form>
</div>
<?php } else { // NOT ON MY LIST OR ANOTHERS ?>
<div id="id_new_add" style="display: inline-block;">
<form id="form-new" style="display: inline-block;" class="class_new_add">
<input style="display: none" type="text" name="title_home" value="<?php echo $title_full; ?>" />
<input style="display: none" name="favorite_home" value="favorite_home" />
<input id="btn_mylist_default_home" style="margin-bottom: 10px; margin-left: -135px;" type="submit" name="btn_password" value="" class="class_fav_hover_off">
</form>
</div>
<?php } ?>
</div>

<?php } // END LOOP ?>

		&lt;script&gt;
$(function () {
$(&#39;.class_new_add&#39;).submit(&#39;click&#39;, function (event) {
event.preventDefault();
$.ajax({
type: &#39;POST&#39;,
url: &#39;ajax/mylist.php&#39;,
data: $(this).serialize(),
success: function (data) {
$(&#39;#id_new_add&#39;).html(&quot;Added to My List&quot;);
}
});
});
});
$(function () {
$(&#39;.class_new_delete&#39;).submit(&#39;click&#39;, function (event) {
event.preventDefault();
$.ajax({
type: &#39;POST&#39;,
url: &#39;ajax/mylist.php&#39;,
data: $(this).serialize(),
success: function (data) {
$(&#39;#id_new_delete&#39;).html(&quot;Removed from My List&quot;);
}
});
});
});
&lt;/script&gt;
&lt;/div&gt;


Here&#39;s an update. Please excuse my ignorance with JavaScript... Right now the success isn&#39;t displaying at all.

&lt;div id=&quot;content-new&quot;&gt;
&lt;?php	
$sql_action = &quot;SELECT movies.img, movies.title, movies.title_full, movies.new, my_list.title, my_list.username FROM movies LEFT JOIN my_list ON movies.title_full = my_list.title WHERE new != &#39;&#39; ORDER BY movies.id DESC LIMIT 16&quot;;
$result_action = mysqli_query( $db_connect, $sql_action )or die( mysqli_error( $db_connect ) );
while ( $row_action = mysqli_fetch_assoc( $result_action ) ) {
$img = $row_action[ &#39;img&#39; ];
$title = $row_action[ &#39;title&#39; ];
$title_full = $row_action[ &#39;title_full&#39; ];
$new = $row_action [ &#39;new&#39; ];
$mylist = $row_action[ &#39;username&#39; ];
// CHECK IF FAV EXISTS MORE THAN ONCE IN DB
$stmt_count_fav = $db_connect-&gt;prepare(&quot;SELECT title FROM my_list WHERE title = ?&quot;); 
$stmt_count_fav-&gt;bind_param(&quot;s&quot;, $title_full);
$stmt_count_fav -&gt; execute();
$stmt_count_fav -&gt; store_result();
$stmt_count_fav -&gt; fetch();
$count_fav = $stmt_count_fav-&gt;num_rows;
$stmt_count_fav-&gt;close();
?&gt;

<div id="div_fav_hover" style="display: inline-block;">
<?php if ( $mylist == $username) { // IS A FAVORITE ?>
<div class="div_new_delete" style="display: inline-block;">
<form id="form-new" style="display: inline-block;" class="class_new_delete">
<input style="display: none" type="text" name="title_home" value="<?php echo $title_full; ?>" />
<input style="display: none" name="favorite_delete_home" value="favorite_delete_home" />
<input id="btn_mylist_on_home" style="margin-bottom: 10px; margin-left: -135px;" type="submit" name="btn_password" value="" class="class_fav_hover_on">
</form>
</div>
<?php } else { // NOT A FAVORITE ?>
<div class="div_new_add" style="display: inline-block;">
<form id="form-new" style="display: inline-block;" class="class_new_add">
<input style="display: none" type="text" name="title_home" value="<?php echo $title_full; ?>" />
<input style="display: none" name="favorite_home" value="favorite_home" />
<input id="btn_mylist_default_home" style="margin-bottom: 10px; margin-left: -135px;" type="submit" name="btn_password" value="" class="class_fav_hover_off">
</form>
</div>
<?php } ?>
</div>

<?php } // END LOOP ?>

		&lt;script&gt;
$(function () {
$(&#39;.class_new_add&#39;).submit(&#39;click&#39;, function (event) {
let thisform = this;
event.preventDefault();
$.ajax({
type: &#39;POST&#39;,
url: &#39;ajax/mylist.php&#39;,
data: $(this).serialize(),
success: function (data) {
thisform.closest(&quot;div&quot;).html(&quot;Added&quot;)
}
});
});
});
$(function () {
$(&#39;.class_new_delete&#39;).submit(&#39;click&#39;, function (event) {
let thisform = this;
event.preventDefault();
$.ajax({
type: &#39;POST&#39;,
url: &#39;ajax/mylist.php&#39;,
data: $(this).serialize(),
success: function (data) {
thisform.closest(&quot;div&quot;).html(&quot;Removed&quot;);
}
});
});
});
&lt;/script&gt;
&lt;/div&gt;


</details>
# 答案1
**得分**: 0
以下是翻译好的内容：
看起来你的事件本身不正确。你有 **submit('click'**，应该是类似 **.on("submit")**。
另外，在ajax调用中使用 "context"，我能够传递 $(this)，这样我可以在成功回调中访问它。
```js
$(function() {
$('.class_new_add').on('submit', function(event) {
event.preventDefault();
$.ajax({
type: 'POST',
url: 'https://httpbin.org/post',
context: $(this),
data: {"key": "value"},
success: function(data) {
$(this).closest("div").html("Added")
}
});
});
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="div_new_add" style="display: inline-block;">
  <form id="form-new" style="display: inline-block;" class="class_new_add">
    <input style="display: none" type="text" name="title_home" value="<?php echo $title_full; ?>" />
    <input style="display: none" name="favorite_home" value="favorite_home" />
    <input type="submit" name="btn_password" value="Add" class="class_fav_hover_off">
  </form>
</div>
英文:

It looks like your event itself isn't correct. You have submit('click' and it should be something like .on("submit").

Also, using "context" in the ajax call I'm able to pass $(this) so it allows me to access that inside of the success.

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-js -->

$(function() {
$(&#39;.class_new_add&#39;).on(&#39;submit&#39;, function(event) {
event.preventDefault();
$.ajax({
type: &#39;POST&#39;,
url: &#39;https://httpbin.org/post&#39;,
context:$(this),
data: {&quot;key&quot;: &quot;value&quot;},
success: function(data) {
$(this).closest(&quot;div&quot;).html(&quot;Added&quot;)
}
});
});
});

<!-- language: lang-html -->

&lt;script src=&quot;https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js&quot;&gt;&lt;/script&gt;
&lt;div class=&quot;div_new_add&quot; style=&quot;display: inline-block;&quot;&gt;
&lt;form id=&quot;form-new&quot; style=&quot;display: inline-block;&quot; class=&quot;class_new_add&quot;&gt;
&lt;input style=&quot;display: none&quot; type=&quot;text&quot; name=&quot;title_home&quot; value=&quot;&lt;?php echo $title_full; ?&gt;&quot; /&gt;
&lt;input style=&quot;display: none&quot; name=&quot;favorite_home&quot; value=&quot;favorite_home&quot; /&gt;
&lt;input type=&quot;submit&quot; name=&quot;btn_password&quot; value=&quot;Add&quot; class=&quot;class_fav_hover_off&quot;&gt;
&lt;/form&gt;
&lt;/div&gt;

<!-- end snippet -->

huangapple
  • 本文由 发表于 2023年5月24日 23:44:46
  • 转载请务必保留本文链接：https://go.coder-hub.com/76325307.html
  • ajax
  • javascript
  • while-loop
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定