03 page refresh and refresh table

Table given id

  var Table = layui.table; 
        table.render ({ 
            elem: '#test' 
            , URL: 'HTTP: // localhost: 7300 / the mock / 5e06d6ef83b40c266813ee7f / Example / User / List' 
            , Toolbar: '#toolbarDemo' // Open head of the tool bar and set it to bind on the left template 
            , defaultToolbar: [ 'filter', 'Exports', 'Print', { // custom toolbar on the right side of the head as no custom icon to remove the parameter. to 
                title: 'prompt' 
                , layEvent: 'LAYTABLE_TIPS' 
                , icon: 'layui-icon-tips' 
            }] 
            , title: 'product list' 
            , cols:[[
                {type: 'CheckBox', Fixed: 'left' } 
                , {Field: 'ID', title: 'internet NO', width: 120, Fixed: 'left', unresize: to true , Sort: to true } 
                , {Field: 'username' , title: 'product name', width: 120, Edit: 'text' } 
                , {Field: 'In Email', title: 'brand and classification', width: 150, Edit: 'text', Templet: function (RES) {
                         return '<EM>' + res.email + '</ EM>' 
                    }} 
                , {Field: 'Sex', title: 'price (RMB)', width: 100, edit : 'text', sort:true}
                ,{field:'city', title:'库存', width:100}
                , {Field: 'Sign', title: 'Goods state' } 
                , {Field: 'preference Experience', title: 'internet recommendation', width: 120, Sort: to true } 
                , {Field: 'The logins', title:' Sorting ', width: 120, Sort: to true } 
                , {Field: ' joinTime ', title:' addition time ', width: 120 } 
                , {Fixed: ' right ', title:' operation ', toolbar:' #barDemo ', width: 150 } 
            ]] 
            , Page: to true 
            , ID: 'goodTable' 
        });

Refresh page

$ ( "layui-laypage-btn.") the Click ();. // execute page refresh the current page

Refresh table

table.reload ( 'goodTable' , { 
                        Page: { 
                            Curr: 1
                             // re-starts from page 1 
                        }, 
                        WHERE: { 
                            Key: 'tname' , 
                            tname: 'John Doe' , 
                        } 
                    });

Pop-tier code

layer.open ({ // pop-up 
                    type:. 1 , 
                    title: 'category adding books' , 
                    MaxMin: to true , 
                    shadeClose: to true , // click off mask layer 
                    Area: ['80% ', '80%' ], 
                    Content: $ ( '# box1' ), 
                    BTN: [ 'OK', 'cancel' ], 
                    Yes: function (index, layero) { // determines to perform a function of 
                        the console.log (layero);
                         // perform a method of adding
                        .getJSON $ (the Data + "/ booktypeAction.action methodName = addBookType?" , { 
                            tname: $ ( "# booktypename1") Val (),. // / character name 
                            / * booktypename: $ ( "the INPUT [name = 'booktypename1' ] "). Val (), * /// role name 
                        }, function (Data) {
                             / * according to the parameters returned back to judge   * / 
                            IF (Data ==. 1 ) { 
                                layer.alert ( 'added successfully', {icon: 1, title: 'prompt'}, function (I) { 
                                    layer.close (I); 
                                    Layer.close(index);// Close the popup 
                                    $ ( "# BookType") [0] .reset () // reset form 
                                }) 
                                table.reload ( 'testReload', { // overloaded form 
                                    Page: { 
                                        Curr: . 1
                                         // again from start page 1 
                                    } 
                                }) 
                            } the else  IF (Data == 2 ) { 
                                layer.msg ( 'add FailedDoNotRetry repeated addition book category name'  )
                            }
                        })

Assignment and values

layui.use ([ 'form', 'layedit', 'laydate'], function () {
   var form = layui.form 
  , Layer = layui.layer 
  , layedit = layui.layedit 
  , laydate = layui.laydate; 
  
  // Date 
  laydate.render ({ 
    elem: '#date' 
  }); 
  laydate.render ({ 
    elem: '# date1' 
  }); 
  
  // Create an editor 
  var EditIndex = layedit.build ( 'LAY_demo_editor' ); 
 
  // custom validation rules 
  form.verify ({ 
    title: function (value) {
       IF(value.length <. 5 ) {
         return 'have at least five characters of the title ah' ; 
      } 
    } 
    , Pass: [
       / ^ [\ S] {6,12} $ / 
      , 'password must be 6-12, and can not appear space ' 
    ] 
    , Content: function (value) { 
      layedit.sync (EditIndex); 
    } 
  }); 
  
  // listening designating switch 
  form.on (' switch (switchTest) ', function (Data) { 
    layer.msg ( ' switch checked : '+ ( the this .checked?' to true ':' to false ' ), { 
      offset: ' 6px ' 
    }); 
    layer.tips ( ' tips: Please note that the switching state can define characters, rather than just ON | OFF '// ,data.othis)
  }); 
  
  Listening submitted 
  form.on ( 'Submit (the demo1)', function (Data) { 
    layer.alert (the JSON.stringify (data.field), { 
      title: 'final submissions' 
    }) return to false ; 
  }) ; // form assignment 
  layui $ ( '#-LAY-Component-form by setval') ON ( 'the Click',.. function () { 
    form.val ( 'Example' , {
       "username": "Yin heart" // "name": "value" 
      , "password": "123456" 
      , "Interest":. 1 
      , "like [Write]":to true // check box is selected 
      , "use Close": to true //
     
 
    Switch status 
      , "sex": "female" 
      , "desc": "I love layui" 
    }); 
  }); 
  
  // form values 
  layui $ ( '# LAY-component -form-getval') on ( '.. the Click ', function () {
     var Data = form.val (' Example ' ); 
    Alert (the JSON.stringify (Data)); 
  }); 
  
});

Tab

layui.tree ({ 
                elem: '#demo', // passing element selector 
                Nodes: Data,
 //                  Spread: to true, 
                the Click: function (Node) { // click menu tree when 
                    var Element = layui.element ;
                     var exist $ = ( "Li [Lay-ID = '" + node.id + "']") length;. // judgment is not a duplicate tab 
                    IF (exist> 0 ) { 
                        element.tabChange ( ' tabs', node.id); // switch to the existing tab 
                    } the else {
                         IF(! node.attributes.menuURL = null ! && node.attributes.menuURL = "") { // determine whether to add tab 
                            element.tabAdd (
                                 'tabs' , 
                                { 
                                    title: node.name, 
                                    Content: ' <iframes = scrolling "Yes" frameborder = "0" the src = " ' 
                                    + node.attributes.menuURL
                                     +'" width = "100%" height = "100%"> </ iframes> ' // support incoming HTML 
                                    ,
                                    // width="99%" height="99%"
                                    id: node.id
                                });
                            element.tabChange('tabs', node.id);
                        }
                    }

                }

            });