当我使用Javascript - jointJS重新加载表单时,我不能保留以前保存的弹出式表单数据

I can't keep my previously saved popup form data when I reload my form using Javascript - jointJS

本文关键字:表单 不能 保留 保存 数据 弹出式 加载 Javascript jointJS 新加载      更新时间:2023-09-26

在函数form中,使用Javascript - jointJS,我尝试创建一个表单,当我按下按钮时显示。

我想保持我的数据后,写下他们在我的表单,当我试图第二次显示我的表单,以便能够查看他们在表单的字段

我该怎么做?到目前为止,我可以成功地第一次查看它们,但不能第二次查看。

form: function(){
            var selectedObjectDataText = JSON.stringify(this.selection.invoke('toJSON'));
            var selectedObjectDataJSON = JSON.parse(selectedObjectDataText);
            if(selectedObjectDataJSON.length > 0){
                if(selectedObjectDataJSON[0].attrs["text"]["text"] == "Activity"){
                    $("#detailsDialog").dialog({
                        autoOpen: false,
                        width: 500, height: 600,
                        close: function() {
                            $("#detailsForm").validate().resetForm();
                            $("#detailsForm").find(".error").removeClass("error");
                        }
                    });
                    $("#detailsForm").validate({
                        rules: {
                            name: { required: true},
                            displayed_name: { required: true},
                            mode: "required",
                            process_group: "required",
                            process_admin: "required",
                            process_in_force_from: { required: true},
                            process_in_force_to: { required: true},
                            created: { required: true},
                            website: { required: true},
                            version: { required: true},
                        },
                        submitHandler: function() {
                            formSubmitHandler(selectedObjectDataJSON, dataJSON);
                        }
                    });
                    var formSubmitHandler = $.noop;
                    var showDetailsDialog = function(client, selectedObjectDataJSON, dataJSON) {
                        if(client.length > 0){
                            alert("BRHKA DATA");
                            $("#name").val(client[0].name);
                            $("#displayed_name").val(client[0].displayed_name);
                            $("#mode").val(client[0].mode);
                            $("#process_group").val(client[0].process_group);
                            $("#process_admin").val(client[0].process_admin);
                            $("#process_in_force_from").val(client[0].process_in_force_from);
                            $("#process_in_force_to").val(client[0].process_in_force_to);
                            $("#website").val(client[0].website);
                            $("#created").val(client[0].created);
                            $("#version").val(client[0].version);
                        }
                        else{
                            $("#name").val('');
                            $("#displayed_name").val('');
                            $("#mode").val('');
                            $("#process_group").val('');
                            $("#process_admin").val('');
                            $("#process_in_force_from").val('');
                            $("#process_in_force_to").val('');
                            $("#website").val('');
                            $("#created").val('');
                            $("#version").val('');                      
                        }
                        formSubmitHandler = function(selectedObjectDataJSON, dataJSON) {
                            saveClient(client, selectedObjectDataJSON, dataJSON);
                        };
                        $("#detailsDialog").dialog("option", "title", "Διαδικασία")
                            .dialog("open");
                    };
                    var saveClient = function(client, selectedObjectDataJSON, dataJSON) {
                        $.extend(client, {
                            Name: $("#name").val(),
                            Displayed_Name: $("#displayed_name").val(),
                            Mode: parseInt($("#mode").val(), 10),
                            Process_Group: parseInt($("#process_group").val(), 10),
                            Process_Admin: parseInt($("#process_admin").val(), 10),
                            Process_In_Force_From: $("#process_in_force_from").val(),
                            Process_In_Force_To: $("#process_in_force_to").val(),
                            Website: $("#website").val(),
                            Created: $("#created").val(),
                            Version: $("#version").val(),
                        });
                        var position = -1;
                        if(dataJSON.length > 0){
                            for(var i=0;i<dataJSON.length && position < 0;i++){
                                var var1 = JSON.stringify(dataJSON[i].ActivityID);
                                var var2 = JSON.stringify(selectedObjectDataJSON[0].id);
                                alert(var1 + " - " + var2);
                                if(var1 == var2){
                                    alert("BRIKA IDIO");
                                    position = i;
                                }
                            }
                        }
                        if(position >= 0){
                            dataJSON[position].name = $("#name").val();
                            dataJSON[position].displayed_name = $("#displayed_name").val();
                            dataJSON[position].mode = $("#mode").val();
                            dataJSON[position].process_group = $("#process_group").val();
                            dataJSON[position].process_admin = $("#process_admin").val();
                            dataJSON[position].process_in_force_from = $("#process_in_force_from").val();
                            dataJSON[position].process_in_force_to = $("#process_in_force_to").val();
                            dataJSON[position].created = $("#created").val();
                            dataJSON[position].website = $("#website").val();
                            dataJSON[position].version = $("#version").val();
                        }
                        else{
                            var myhtml = { "ActivityID": selectedObjectDataJSON[0].id,
                                           "name": $("#name").val(),
                                           "displayed_name": $("#displayed_name").val(),
                                           "mode": $("#mode").val(),
                                           "process_group": $("#process_group").val(),
                                           "process_admin": $("#process_admin").val(),
                                           "process_in_force_from": $("#process_in_force_from").val(),
                                           "process_in_force_to": $("#process_in_force_to").val(),
                                           "created": $("#created").val(),
                                           "website": $("#website").val(),
                                           "version": $("#version").val() };
                            dataJSON.push(myhtml);
                        }
                        $("#formData").html(JSON.stringify(dataJSON));
                        $("#detailsDialog").dialog("close");
                    };

                    var activityData = JSON.parse("[]");
                    var objData = $("#formData").html();                    
                    var dataJSON = JSON.parse(objData);
                    var position = -1;
                    var selectedObjectDataText = JSON.stringify(this.selection.invoke('toJSON'));
                    var selectedObjectDataJSON = JSON.parse(selectedObjectDataText);    

                    alert(JSON.stringify(selectedObjectDataJSON[0].id));
                    if(dataJSON.length > 0){
                        for(var i=0;i<dataJSON.length && position < 0;i++){
                            var var1 = JSON.stringify(dataJSON[i].ActivityID);
                            var var2 = JSON.stringify(selectedObjectDataJSON[0].id);
                            if(var1 == var2){
                                position = i;
                            }
                        }
                    }
                    if(position >= 0){
                        activityData.push(dataJSON[position]);
                    }
                    showDetailsDialog(activityData, selectedObjectDataJSON, dataJSON);
                }
            }
        },

看起来你在寻找的更多的是关于你如何处理你的表单,而不是你如何处理它。

你的问题最简单的选项似乎是使用情态动词:

使用bootstrap,你可以有一个模态,当你点击按钮时,它会隐藏和显示模态。点击按钮不会修改模态/表单中的数据(除非你改变它),所以它会保留用户已经输入的表单数据。

如果你不想使用模态(出于各种原因),有一个表单,并隐藏它/显示它基于点击你的按钮似乎比每次创建表单更合适。通过将样式显示更改为none,表单将被隐藏,但数据将保留(除非刷新页面)。