如何在php的数据百分比进度条中设置ajax数据值?

如何在php的数据百分比进度条中设置ajax数据值?,php,ajax,mysqli,Php,Ajax,Mysqli,代码: 在这段代码中,我创建了百分比进度条。现在在我的ajax文件中,即get-source.php和get-tech.php,我通过查询计算了百分比,该百分比工作正常,也显示在进度条中,但问题是当我更改下拉列表中的任何值时,它显示百分比,但我无法通过ajax将动态值传递给数据百分比。那么,我该怎么做呢?请帮帮我 谢谢在ajax代码中,您必须动态设置数据百分比值;每一次。 应该是这样的, <script> $(document).ready(function(){

代码:

在这段代码中,我创建了百分比进度条。现在在我的ajax文件中,即get-source.php和get-tech.php,我通过查询计算了百分比,该百分比工作正常,也显示在进度条中,但问题是当我更改下拉列表中的任何值时,它显示百分比,但我无法通过ajax将动态值传递给数据百分比。那么,我该怎么做呢?请帮帮我


谢谢

在ajax代码中,您必须动态设置数据百分比值;每一次。 应该是这样的,

<script>
    $(document).ready(function(){
        $("#source").change(function(){
            source = $(this).val();
            $.ajax({
                type:"POST",
                data:{"source":source},
                url:"get-source.php",
                success:function(data){

                    show = JSON.parse(data);
                    $("#total").html(show.total);
                    $("#sources").html(show.sources);
                    $("#progress1").attr('data-percent', 5);
                    $("#progress1").data('percent', 5);
                }
            });
        });

        $("#tech").change(function(){
            tech = $(this).val();
            $.ajax({
                type:"POST",
                data:{"tech":tech},
                url:"get-tech.php",
                success:function(data){

                    show = JSON.parse(data);
                    $("#per_tech").html(show.per_tech);
                    $("#techno").html(show.techno);
                    $("#progress2").attr('data-percent', 5);
                    $("#progress2").data('percent', 5);
                }
            });
        }); 
    });
</script>

<select name="source" id="source" class="form-control">
    <option>Select Source</option>
    <?php
        $sql = "select name from source";
        $res = mysqli_query($con,$sql);
        while($rows = mysqli_fetch_array($res))
        {
            echo "<option value='".$rows['name']."'>".$rows['name']."</option>";
        }
    ?>
</select>
<select name="tech" id="tech" class="form-control">
    <option>Select Technology</option>
    <?php
        $sql = "select name from course";
        $res = mysqli_query($con,$sql);
        while($rows = mysqli_fetch_array($res))
        {
            echo "<option value='".$rows['name']."'>".$rows['name']."</option>";
        }
    ?>
</select>

<div class="bar-chart">
    <div class="chart clearfix">
        <div class="item">
            <div class="bar">
                <span class="percent"><div id="total"></div></span>
                <div class="progress" id="progress1" data-percent="75">
                    <span class="title"><div id="sources"></div></span>
                </div>
            </div>
        </div>

        <div class="item">
            <div class="bar">
                <span class="percent"><div id="per_tech"></div></span>
                <div class="progress" id="progress2" data-percent="">
                    <span class="title"><div id="techno"></div></span>
                </div>
            </div>
        </div>
    </div>
</div>

共享您的源代码和技术html代码以及get-source.php和get-tech.php php代码,但是源代码在哪里,因为如果有onchange事件,它应该是dropdown或其他什么?我在我的代码中进行了编辑,您可以看到source dropdown和tech dropdown@bhumishah查看Ajax调用的xhr属性$.ajaxSettings.xhr及其onprogress事件@omkara:我在本地检查了您的代码,它正在将值传递给数据-*。问题不是动态值,数据父级没有改变。函数成功时,是否只调用一次成功?您需要不断地获取数据,而不仅仅是在传输成功时。
$("#tech").change(function(){
        tech = $(this).val();
        $.ajax({
            type:"POST",
            data:{"tech":tech},
            url:"get-tech.php",
            success:function(data){

                show = JSON.parse(data);
                $("#per_tech").html(show.per_tech);
                $("#techno").html(show.techno);
                $("#progress2").attr('data-percent', show.per_tech);//here you can pass the value

            }
        })