smartwizard 点击提交按钮后界面被刷新

项目中用到了smartwizard,对用户的入网配置进行了分步操作

这个插件给的范例中除了提供上一步下一步之外, 还可以添加其他的按钮

我这边额外添加了两个按钮,分别是提交和关闭

点击提交按钮时,异步向后台提交数据,步骤配置代码如下:

$(‘#smartwizard‘).smartWizard({
        selected: 0,
        theme: ‘dots‘,
        cycleStep: false,
        transitionEffect:‘fade‘,
        keyNavigation: false,
        showStepURLhash: false,
        toolbarSettings: {toolbarPosition: ‘bottom‘,
            toolbarExtraButtons: [btnFinish, btnCancel]
        },
        lang : {
            next: ‘下一步‘,
            previous: ‘上一步‘
        }

    });

btnFinish和btnCancel分别对应的就是上述的[提交]和[关闭] 按钮, 按钮对应的方法如下:

var btnFinish = $(‘<input type="button" id="btnFinish"></input>‘).addClass(‘btn btn-info‘).on(‘click‘, function(){
    var mask;
    $.ajax({
        type: "POST",
        url: ‘/xxx‘,
        data: {corpId: "123"},
        dataType: ‘json‘,
        async: false,
        cache: false,
        beforeSend: function() {
            mask = layer.load(0, {
                shade: [0.7, ‘#393D49‘]
            },
            {
                shadeClose: true
            }); //0代表加载的风格,支持0-2
        },
        success: function(data) {
            var jsonData = eval(data);
            if (jsonData.code == ‘10000‘) {
                layer.alert(‘配置成功‘, {
                    icon: 1
                });
                $(‘#reportTable‘).bootstrapTable(‘refresh‘);
            } else {
                layer.alert(jsonData.msg, {
                    icon: 2
                });
            }
            layer.close(configLayer);
            layer.close(mask);
        },
        error: function(data) {
            alert("error");
            $(‘#reportTable‘).bootstrapTable(‘refresh‘);
        }
    })
});

碰到的问题:

1. 点击提交按钮和关闭按钮后, 界面被刷新

根据https://bbs.csdn.net/topics/391852021中4楼的回答

将上面代码标红的地方修改为如下代码,问题虽好了,但是我明明有给设置value值呀.. 咋button就没名字了:最终显示效果是button有了,但是button中没有值了..

<input type="button" id="btnFinish" value="提交"></input>

解决办法是:在初始化smartWizard控件后给这两个button赋值(手动笑脸??)

我这边的分步操作的界面是放在模态框中的,当模态框打开成功后我就给两个button的value赋值

$(‘#btnFinish‘).val("提交");
$(‘#btnCancel‘).val("关闭");

原文地址:https://www.cnblogs.com/hans-z/p/10465813.html

时间: 2024-10-13 01:24:40

smartwizard 点击提交按钮后界面被刷新的相关文章

点击button按钮后界面不自动刷新

问题: 我使用的button标签,在 标签中没有使用ruant=“server”的属性,但是在点击button时,界面还是会刷新 解决方式: 由于界面中含有form标签,而button标签的默认type是submit.所以相当于进行了form提交操作.为了是界面不刷新只需要在botton标签中加入type=“button”即可.

ASP.NET怎么防止多次点击提交按钮重复提交

今天做一个系统,由于服务器有点慢,所以常会被点击两次或三次,提交的数据就是多次了.所以要让按钮点击后,不能再次点击. 对于一个按钮,要让变成恢色的,只要this.disabled=true就可以了,可是在.NET里,添加了ONCLICK后,就无法提交信息了.所以要加上以下代码. <asp:Button ID="btnSub" runat="server" Text="回复" OnClick="btnSub_Click"

asp.net中如何防止用户重复点击提交按钮

asp.net中如何防止用户重复点击提交按钮 asp.net 中防止因为网速慢等影响交互的问题导致用户可能点击多次提交按钮,从而导致数据库中出现多条重复的记录,经过亲自验证在网上找的方法,找到两个切实可行的方法:第一种方法1.页面前台按钮: <asp:Button ID="btnSumbit" runat="server" Text="提交" onclick="btnSumbit_Click" /> 在后台Page

cocos2d-x:解决点击拖动按钮后,所在的layer监听不到触摸事件的问题

点击拖动按钮后,想让所在的layer监听到屏幕的触摸事件,可以把该按钮拖动开始的时候设置setTouchEnabled为false;例: #include "ui/UIButton.h" bool myDemo::init() { // 设置点击事件 EventListenerTouchOneByOne *listener = EventListenerTouchOneByOne::create(); listener->onTouchBegan = CC_CALLBACK_2(

页面实现验证码功能,点击“注册”按钮后,无论是否完成注册,验证码都能够自动刷新

要求页面实现验证码功能,点击"注册"按钮后,无论是否完成注册,验证码都能够自动刷新 <script> function validteCode() { var codes = new Array(4);       // var colors = new Array("Red","Green","Gray","Blue","Maroon","Aqua",&

【ASP.NET】 【防止连续多次点击提交按钮 导致页面重复提交】

最近做项目遇到了这样的情况: 公司网络比平常慢了不少,在点击保存按钮提交页面后需等待挺长的一段时间,忍不住手贱点多了几次,当提交完成后发现数据库语句执行异常. 两种验证方式: 第1种: aspx页面按钮: <asp:Button ID="btnSumbit" runat="server" Text="提交" onclick="btnSumbit_Click" /> Page_Load 事件: btnSumbit.A

vue中,点击button按钮后,页面上的input框自动聚焦

需求:点击button按钮,录入成功后,页面上的input框自动聚焦,快速进行下一次录入,提高效率 开始尝试了几种方法都没有成功 一.首先想到的用vue指令 v-focus,然而没有成功 <Input v-model="book.isbnOrIssn" @change.native="_getIsbn" @blur="_getIsbn" :disabled="snDisabled" v-focus placeholder

原生实现点击某个按钮后弹出弹出框

window.onload=function(){ var a = document.getElementById("tdful"); var b = a.getElementsByTagName("li");// 获取第一列所有单元 var d = document.getElementById("secondtd");//获取所有模板 var c = d.getElementsByTagName("div"); for(v

win10系统点击关机按钮后无法关机的解决办法

先吐槽下:我越发的发现我现在成了修电脑的了,我的职位是linux运维,现在干的活很蛋疼,公司只有我一个运维,修电脑.搞网络.抬服务器.弄监控,搭环境.搞自动化发布.弄虚拟化都我一个人哇.好了,打住. 解决办法: 在控制面板里找到电源选项,找到更改当前不可用的设置,把启用快速启动对勾取消.重启电脑,反正我的是好了. 参考博客地址:http://www.xitongcheng.com/jiaocheng/win10_article_13072.html