使用PHP Ajax在MySQL数据库中存储开/关按钮的值

使用PHP Ajax在MySQL数据库中存储开/关按钮的值,php,jquery,mysql,ajax,Php,Jquery,Mysql,Ajax,我找到了一个单一ID的教程 我已经根据我的知识修改了多个id,我无法使用ajax获取id。我不擅长ajax。我已经附上了两个代码。谁能告诉我如何修复多个id 我还附上了一个屏幕截图 index.php <?php $query=mysql_connect("localhost","pma","pmapass"); mysql_select_db("testdb",$query); include("connection1.php"); $result = mysql_query("

我找到了一个单一ID的教程

我已经根据我的知识修改了多个id,我无法使用ajax获取id。我不擅长ajax。我已经附上了两个代码。谁能告诉我如何修复多个id

我还附上了一个屏幕截图

index.php

    <?php
$query=mysql_connect("localhost","pma","pmapass");
mysql_select_db("testdb",$query);
include("connection1.php");
$result = mysql_query("SELECT * FROM mytable ORDER BY id");
?>
<script type="text/javascript"src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js">
</script>

 <div>
              <table id="datatables" class="display">
                <thead>
                  <tr>
                    <th>ID</th>
                    <th>Name</th>
                    <th>Text</th>
                  </tr>
                </thead>
               <tbody>
                  <?php
                    while ($row = mysql_fetch_array($result)) {
                        ?>
                  <tr>
                    <td><?php echo $row["id"]; ?></td>
                    <td><?php echo $row["name"]; ?></td>
                    <td><?php echo $row["text"]; ?></td>
                    <td><script type="text/javascript">
$(document).ready(function(){
$('#myonoffswitch<?php echo $row["id"]; ?>').click(function(){
var myonoffswitch<?php echo $row["id"]; ?>=$('#myonoffswitch<?php echo $row["id"]; ?>').val();
if ($("#myonoffswitch<?php echo $row["id"]; ?>:checked").length == 0)
{
var a<?php echo $row["id"]; ?>=myonoffswitch<?php echo $row["id"]; ?>;
}
else
{
var a<?php echo $row["id"]; ?>="off";
}

$.ajax({
type: "POST",
url: "ajax.php",
data: "value="+a<?php echo $row["id"]; ?>,
success: function(html){
$("#display").html(html).show();
}
});

});
});
</script><div class="onoffswitch">
<input type="hidden" value="<?php echo $row["id"]; ?>" name="ids" />
<input type="checkbox" name="onoffswitch<?php echo $row["id"]; ?>" class="onoffswitch-checkbox" id="myonoffswitch<?php echo $row["id"]; ?>"
<?php
$query3=mysql_query("select * from mytable where id=$row[id]");
$query4=mysql_fetch_array($query3);
if($query4['text']=="off")
{
echo "checked";
}
?>>
<label class="onoffswitch-label" for="myonoffswitch<?php echo $row["id"]; ?>">
<div class="onoffswitch-inner"></div>
<div class="onoffswitch-switch"></div>
</label>
</div>
<div id="display"></div>
</td>
                  </tr>
                  <?php
                    }
                    ?>
                </tbody>
              </table>
            </div>
    <?php
$query=mysql_connect("localhost","pma","pmapass");
mysql_select_db("testdb",$query);
include("connection1.php");
$result = mysql_query("SELECT * FROM mytable ORDER BY id");
?>

<script type="text/javascript"src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js">
</script>

<div>
    <table id="datatables" class="display">
        <thead>
        <tr>
            <th>ID</th>
            <th>Name</th>
            <th>Text</th>
        </tr>
        </thead>
        <tbody>
        <?php while ($row = mysql_fetch_array($result)) { ?>
            <tr>
                <td><?php echo $row["id"]; ?></td>
                <td><?php echo $row["name"]; ?></td>
                <td><?php echo $row["text"]; ?></td>
                <td>
                    <div class="onoffswitch">
                        <input type="hidden" value="<?php echo $row["id"]; ?>" />
                        <input type="checkbox" class="onoffswitch-checkbox"
                            <?php
                            if($row['text']=="off")
                            {
                                echo "checked";
                            }
                            ?>>
                        <label class="onoffswitch-label" for="myonoffswitch<?php echo $row["id"]; ?>">
                            <div class="onoffswitch-inner"></div>
                            <div class="onoffswitch-switch"></div>
                        </label>
                    </div>
                    <div id="display">
                    </div>
                </td>
            </tr>
        <?php
        }
        ?>
        </tbody>
    </table>
    <script type="text/javascript">
        $(document).ready(function(){
            $('.onoffswitch').click(function(){
                var hiddenValueID = $(this).children(':hidden').val();
                if ($(this).children(':checked').length == 0)
                {
                    var valueData = 'on';
                }
                else
                {
                    var valueData = 'off';
                }

                $.ajax({
                    type: "POST",
                    url: "ajax.php",
                    data: {value: valueData, id: hiddenValueID} ,
                    done: function(html){
                        $("#display").html(html).show();
                    }
                });

            });
        });
    </script>
</div>
Ajax.php

为了你自己;:

请整理你的代码 如果无法从数据库加载某些内容,请在 为什么是2。查询时,您已使用select*? 然而,这里有一个基于未测试代码的示例:

index.php

    <?php
$query=mysql_connect("localhost","pma","pmapass");
mysql_select_db("testdb",$query);
include("connection1.php");
$result = mysql_query("SELECT * FROM mytable ORDER BY id");
?>
<script type="text/javascript"src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js">
</script>

 <div>
              <table id="datatables" class="display">
                <thead>
                  <tr>
                    <th>ID</th>
                    <th>Name</th>
                    <th>Text</th>
                  </tr>
                </thead>
               <tbody>
                  <?php
                    while ($row = mysql_fetch_array($result)) {
                        ?>
                  <tr>
                    <td><?php echo $row["id"]; ?></td>
                    <td><?php echo $row["name"]; ?></td>
                    <td><?php echo $row["text"]; ?></td>
                    <td><script type="text/javascript">
$(document).ready(function(){
$('#myonoffswitch<?php echo $row["id"]; ?>').click(function(){
var myonoffswitch<?php echo $row["id"]; ?>=$('#myonoffswitch<?php echo $row["id"]; ?>').val();
if ($("#myonoffswitch<?php echo $row["id"]; ?>:checked").length == 0)
{
var a<?php echo $row["id"]; ?>=myonoffswitch<?php echo $row["id"]; ?>;
}
else
{
var a<?php echo $row["id"]; ?>="off";
}

$.ajax({
type: "POST",
url: "ajax.php",
data: "value="+a<?php echo $row["id"]; ?>,
success: function(html){
$("#display").html(html).show();
}
});

});
});
</script><div class="onoffswitch">
<input type="hidden" value="<?php echo $row["id"]; ?>" name="ids" />
<input type="checkbox" name="onoffswitch<?php echo $row["id"]; ?>" class="onoffswitch-checkbox" id="myonoffswitch<?php echo $row["id"]; ?>"
<?php
$query3=mysql_query("select * from mytable where id=$row[id]");
$query4=mysql_fetch_array($query3);
if($query4['text']=="off")
{
echo "checked";
}
?>>
<label class="onoffswitch-label" for="myonoffswitch<?php echo $row["id"]; ?>">
<div class="onoffswitch-inner"></div>
<div class="onoffswitch-switch"></div>
</label>
</div>
<div id="display"></div>
</td>
                  </tr>
                  <?php
                    }
                    ?>
                </tbody>
              </table>
            </div>
    <?php
$query=mysql_connect("localhost","pma","pmapass");
mysql_select_db("testdb",$query);
include("connection1.php");
$result = mysql_query("SELECT * FROM mytable ORDER BY id");
?>

<script type="text/javascript"src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js">
</script>

<div>
    <table id="datatables" class="display">
        <thead>
        <tr>
            <th>ID</th>
            <th>Name</th>
            <th>Text</th>
        </tr>
        </thead>
        <tbody>
        <?php while ($row = mysql_fetch_array($result)) { ?>
            <tr>
                <td><?php echo $row["id"]; ?></td>
                <td><?php echo $row["name"]; ?></td>
                <td><?php echo $row["text"]; ?></td>
                <td>
                    <div class="onoffswitch">
                        <input type="hidden" value="<?php echo $row["id"]; ?>" />
                        <input type="checkbox" class="onoffswitch-checkbox"
                            <?php
                            if($row['text']=="off")
                            {
                                echo "checked";
                            }
                            ?>>
                        <label class="onoffswitch-label" for="myonoffswitch<?php echo $row["id"]; ?>">
                            <div class="onoffswitch-inner"></div>
                            <div class="onoffswitch-switch"></div>
                        </label>
                    </div>
                    <div id="display">
                    </div>
                </td>
            </tr>
        <?php
        }
        ?>
        </tbody>
    </table>
    <script type="text/javascript">
        $(document).ready(function(){
            $('.onoffswitch').click(function(){
                var hiddenValueID = $(this).children(':hidden').val();
                if ($(this).children(':checked').length == 0)
                {
                    var valueData = 'on';
                }
                else
                {
                    var valueData = 'off';
                }

                $.ajax({
                    type: "POST",
                    url: "ajax.php",
                    data: {value: valueData, id: hiddenValueID} ,
                    done: function(html){
                        $("#display").html(html).show();
                    }
                });

            });
        });
    </script>
</div>
ajax.php

<?php
$query=mysql_connect("localhost","pma","pmapass");
mysql_select_db("testdb",$query);
if(isset($_POST['value']))
{
    $value=$_POST['value'];
    $id=$_POST['id'];
    mysql_query("update mytable set text='$value' where id=$id");
    echo "<h2>You have Chosen the button status as:" .$value."</h2>";
}
?>

如果从ajax请求中得到答案,您可以查看浏览器控制台。

很难理解您的代码。。。用php生成js变量名可能不是最好的解决方案。。。你到底想干什么?你的按钮在哪里?我想用那个按钮隐藏数据。我有超过10个带有数据的ID。我希望每个ID上的按钮都能正常工作。这是一个不错的按钮,但按钮滑动不起作用。朋友,我已经解决了这个问题,谢谢你的快速帮助。你能告诉我一个更好的学习ajax的方法吗?对于纯ajax,你可以在这里看看,或者在使用jQuery这样的包装器时看看,或者