【问题标题】:How to make gridstack auto widgets moving stop towards upward?如何使gridstack自动小部件向上移动停止?
【发布时间】:2015-09-23 08:57:58
【问题描述】:

我希望 gridstack 团队身体健康..! 我只想在我移动一个小部件时能够做到这一点,这样其他小部件就不会向上移动以填充它的空白位置..! 相反,当我移动一个小部件时,我希望其他小部件留在它们的位置,而不是向上填充新移动的小部件位置..! 我要怎么做?有人可以让我知道吗..?我试图到处检查和搜索,但要么没有得到它,要么没有得到它如何使它工作..!

 <script type="text/javascript">
 var jq=jQuery.noConflict();
    jq(document).ready(function (e) {
    jq('.upload').on('submit',(function(e) {
        e.preventDefault();
        var formData = new FormData(this);

        jq.ajax({
            type:'POST',
            url: jq(this).attr('action'),
            data:formData,
            cache:false,
            contentType: false,
            processData: false,
            success: function(data)
        {
          jq(".no_image").css("display", "none"),
          jq(".show_image").css("display", "block"),
          jq(".profile_photo").val(function(index, currentValue) {
    return currentValue + data;
});
      jq(".image").attr("src","client_images/"+data);
        },
            error: function(data){
                console.log("error");
                console.log(data);
            }
        });
    }));

    jq(".inputFile").on("change", function() {
        jq(".upload").submit();
    });
$(function () {
    var options = {
        cell_height: 70
    };
    $('.grid-stack').gridstack(options);
     this.grid = $('.grid-stack').data('gridstack');
      this.save_grid = function () {
                    this.serialized_data = _.map($('.grid-stack > .grid-stack-item:visible'), function (el) {
                        el = $(el);
                        var node = el.data('_gridstack_node');
                        return {
                            x: node.x,
                            y: node.y,
                            width: node.width,
                            height: node.height
                        };
                    }, this);
                     $.ajax
    ({
        type: "POST",
        //the url where you want to sent the userName and password to
        url: 'save_grid.php',
        async: false,
        //json object to sent to the authentication url

        data: {'positions': JSON.stringify(this.serialized_data, null, '    ')},
        success: function () {

        alert("Positions Saved!"); 
        }
    })

                }.bind(this);


                $('#save-grid').click(this.save_grid);

                this.load_grid();
});



});
</script>

现场示例: http://troolee.github.io/gridstack.js/

【问题讨论】:

    标签: javascript jquery gridster


    【解决方案1】:

    尝试在初始化选项中设置float: true。除非您手动移动,否则您的网格项目不会向上或移动到任何地方。

    例如:

    $(function () {
        var options = {
            cell_height: 80,
            float : true
        };
        $('.grid-stack').gridstack(options);
    });
    

    【讨论】:

    • 对不起,我的上一条评论是帖子审查的一部分,现在您的答案得到了改进。请注意,如果您对自己的问题有正确答案,可以将其标记为已接受答案!
    • @JosEduSol 感谢兄弟的帮助..!
    猜你喜欢
    • 2018-09-12
    • 1970-01-01
    • 2019-03-08
    • 1970-01-01
    • 2020-05-13
    • 1970-01-01
    • 2019-12-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多