Materialzie模态在javascript中不起作用

时间:2018-09-06 02:30:58

标签: javascript jquery ajax materialize

我试图通过在ajax请求成功后附加模式来使其工作,该模式在我的php代码中有效,但是当我尝试将其转换为ajax Jquery代码时,当我单击“编辑”按钮时,未显示任何数据甚至是错误代码。代码的第一块是用于模式工作的插件。

view_tweet函数根据返回对象生成视图

(function ($) {
    $(function () {

        $('.modal').modal();
        $('.trigger-modal').modal();

    }); 
})(jQuery); 

$(function() {
  $('.modal-trigger').modal();
});

function view_tweet(iOffset) {
    $.ajax({
        url: '/tweet/rest/viewTweet',
        type: 'get',
        data: {
            'offset' : iOffset,
            'limit'  : 10
        },
        dataType: 'json',
        timeout: 3000,
        success: function(data){
            var aTweetList = data[0]['aTweetList'];
            if (data[0]['aTweetList']) {
                for(var i=0; i<aTweetList.length;i++){
                    if(data[1] === aTweetList[i]['id']){
                        var string = `
                            <div class="col s2">
                                <a href="#modal${aTweetList[i]['t_id']}" class="modal-action waves-effect waves-light btn modal-trigger">Edit</a>
                                <button onclick="delete_tweet(${aTweetList[i]['t_id']})" class="waves-effect waves-light btn">Delete</button>
                            </div>
                        `;
                    } else {
                        string = '';
                    }

                    console.log(aTweetList[i]);
                    $('#tweetList').append(
                        `
                        <div class='row'>
                            <div class='car hoverable'>
                                <div class='col s1'>
                                    <img class="responsive-img circle" src='/img/${aTweetList[i]['u_profilePicture']}' alt='profile picture'>
                                    <div>
                                        <a href='../../tweet/front/profilePage?id='${aTweetList[i]['id']}>
                                        ${aTweetList[i]['u_username']}
                                        </a>
                                    </div>
                                </div>

                                <div class="col s9">
                                    <p>${aTweetList[i]['t_tweet']}</p>
                                    <small>${moment(aTweetList[i]['t_datePosted']).fromNow()}</small>
                                </div>


                                ${string}

                            </div>
                        </div>

                        <div id='modal${aTweetList[i]['t_id']}' class='modal'>
                            <div class='modal-content'>
                                <h4>Edit Tweet</h4>
                                <textarea id='newTweet${aTweetList[i]['t_id']}' name='post_tweet' class='materialize-textarea'>${aTweetList[i]['t_tweet']}</textarea>
                            </div>
                            <div class='modal-footer'>
                                a href="#"  onclick="edit_tweet(${aTweetList[i]['t_id']});" class="waves-effect waves-green btn-flat modal-close">Save</a>
                                <a href="#" class="modal-close waves-effect red darken-4 btn">Close</a>
                            </div>
                        </div>

                        `);
                }
            }
        }
    }); 
}

0 个答案:

没有答案