时间戳

首页 > 解决方案 > 在模态的 AJAX 中动态生成引导模态我正在尝试使用 AutoNumeric 4.6 但这不起作用（PHP）

javascript - 在模态的 AJAX 中动态生成引导模态我正在尝试使用 AutoNumeric 4.6 但这不起作用（PHP）

问题描述

我在我的项目中使用https://makitweb.com/dynamically-load-content-in-bootstrap-modal-with-ajax/ 。

我正在尝试在 Ajax 的输入类型文本中使用 Autonumeric 4.6 生成引导模式。

我在一般的 html 文件、php 文件中添加了 AutoNumeric 脚本，什么都没有。脚本工作但不是 AJAX 生成模式。

请帮忙

我的代码：

HTML

<!-- Modal -->
<div class="modal fade" id="empModal" role="dialog" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog modal-xl">

        <!-- Modal content-->
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title">Current Money</h4>
                <button type="button" class="close" data-dismiss="modal">&times;</button>

            </div>
            <div class="modal-body">

            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-outline-secondary" data-dismiss="modal">Close</button>
            </div>
        </div>

    </div>
</div>

AJAX

$(document).ready(function(){

        $('.CurrentMoney').click(function(){

            var CurrentMoney= $(this).data('id');

            $.ajax({
                url: '../Server-Side/CurrentMoney.php',
                type: 'post',
                data: {CurrentMoney: CurrentMoney},
                success: function(response){
                    // Add response in Modal body
                    $('.modal-body').html(response);
                    // Display Modal
                    $('#empModal').modal('show');
                }
            });
        });
    });

CurrentMoney.php

<?php

if(isset($_POST['CurrentMoney']))
{

$response = '<input type="text" class="AutoNumeric">';
        echo $response;
    

}
else {
    $response = 'Error';
    echo $response;

}

exit;

?>

自动数值库

<!-- autonumeric4 -->
<script src="../plugins/autoNumeric/src/autonumeric4.6.js"></script>

<script>

    const autoNumericOptionsEuro = {
        digitGroupSeparator        : ' ',
        allowDecimalPadding: false
    };

    new AutoNumeric('.AutoNumeric', autoNumericOptionsEuro);

</script>

JSFiddle - 代码 https://jsfiddle.net/Fox21/ht1kyuvw/3/

标签： javascriptphpjqueryajax

解决方案

ajax 调用完成后调用 AutoNumeric 库

类似的东西

$(文档).ready(函数(){

    $('.CurrentMoney').click(function(){

        var CurrentMoney= $(this).data('id');

        $.ajax({
            url: '../Server-Side/CurrentMoney.php',
            type: 'post',
            data: {CurrentMoney: CurrentMoney},
            success: function(response){
                // Add response in Modal body
                $('.modal-body').html(response);
                // Display Modal
                $('#empModal').modal('show');
               
                 
const autoNumericOptionsEuro = {
    digitGroupSeparator        : ' ',
    allowDecimalPadding: false
};

new AutoNumeric('.AutoNumeric', autoNumericOptionsEuro);

            }
        });
    });
});

推荐阅读