Fonction d'implémentation: Implémentez le tableau T Faire glisser et enregistrer le niveau modifié en raison de la traînée.
Code JSP
<div id = "MainContainer"> <div> <div id = "b_center"> <div id = "Launch-detail-table"> <div> <h2 style = "margin-bottom: 0px; margin-top: 0px; height: 43px; line-height: 43px;"> menu Management </h2> <pan style = "Color: red"> red glisser et drop to ajuster </h2> <pan style = "Color: red"> Red " id="addLG" type="button"> <img src="/center/images/btn_add.png">Add menu</button> </div> <br> <div> <table cellpacing="0" id="showTable" style="word-wrap: break-word; word-break: break-all;table-layout: inherit;background:#FFFFFF !important;"> <thead> <tr > <th style = "Text-Align: Center; Width: 10%;"> Number </ Th> <thalign = "Center" style = "Text-Align: Center; Width: 17%"> Nom du menu </ th> <! - <th Align = "Center" style = "Text-Adign: Center"> Menu Level </ Th> <Th Align = "Center" Style = "Text-align: Centre" Style = "Text-Align: Center"> Menu de deuxième niveau </th> -> <th align = "Center" style = "Text-Align: Center; Width: 18%"> Menu Nom English </ Th> <th Align = "Center" Style = "Text-Align: Center; Width: 15%"> Menu Type </ Th> <Th Align = "Center" Style = "Text-Ralign: Centre; Width: 20%" affiché </th> <thalign = "Center" style = "text-align: Center; largeur: 20%"> Operation </th> </tr> </thead> <tbody id = "data-list" style = "text-align: Center;"> <% if (Menulist! = null && menulist.size ()> 0) {pour (int i = 0; JSONObject JSON = MENULIST.GetJSonObject (i); Menu menu = (menu) jsonObject.tobean (json.getjsonObject ("menu"), menu.class); %> <tr id = "<% = menu.getLevel ()%>"> <td id = "<% = menu.getMenuid ()%>"> <% = menu.getLevel ()%> </td> <td> <div> <% = menu.getMenuname ()%> </div> </td> <td> <div> <% = menu.getenMenuname () == null? "": menu.getenMenuname ()%> </ div> </td> <! - <Td> <div> <% // if (menu.GethAsCond () == 1) {%> Menu de premier niveau <% //} else {%> secondaire menu de niveau <% // <Td> <div> <% // if (json.getString ("ischild"). Equals ("1")) {%> <a href = "javascript: void (0)" rel = "externe nofollow" rel = "external nofollow" rel = "external nofollow" externe " onclick = "getchildMenu ('<% // menu.getMenuid ()%>')"> Affichage </a> <% //} else {%> Aucun <% //}%> </ div> </ td> -> <td> <div> <% if (menu.getMenutype () == 0) {%> System type <%} else if (Menu 1) {%> Type de texte <%} else {%> Type de lien <%}%> </div> </td> <td> <% if (menu.getState () == 0) {%> <Button Type = "Button" OnClick = "MenuMenState ('<% = menu.getMenuname ()%>', <% = Menu type = "Button" style = "background: #eaeaa; colore: # d0d0d0;"> masquer </utton> <%} else {%> <button type = "Button" style = "background: #eaea; colore: # d0d0d0;"> show </ bouton> <bouton type = "bouton" sur ") %> ', <% = menu.getMenuid ()%>, 0) "> hide </futton> <%}%> </td> <td> <% if (menu.getMenuty rel = "externe nofollow" style = "couleur: rouge; largeur: 30px; affichage: bloc en ligne;" id = "<% = menu.getMenuid ()%>"> </a> </div> <%}%> <% if (menu.getMenutype ()! = 0) {%> <div style = "float: right; margin-droite: 10px;"> <a href = "javascript: void (0)" rel = "external nofollow" rel = "external = rofollow =" rel = "external Nofollow nofollow "style =" couleur: rouge; largeur: 30px; affichage: bloc en ligne; " id = "<% = menu.getMenuid ()%>"> </a> </ div> <%}%> </td> </tr> <%}} else {%> <tr> <td Colspan = "6" Align = "Center"> Aucune donnée encore </ td> </r> <%}%> </pody> </pall </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> </ div> <div style = "height: 50px; line-height: 50px;"> <div style = "display: non;"> <a href = "#" rel = "externe nofollow" rel = "externe nofollow" rel = "external nofollow" rel = "external nofollow"> autour de nous </a> | <a href = "#" rel = "externe nofollow" rel = "externe nofollow" rel = "externe nofollow" rel = "externe nofollow" rel = "externe nofollow"> weibo </a> | <a href = "#" rel = "external nofollow" rel = "externe nofollow" rel = "external nofollow" rel = "external nofollow" rel = "external nofollow" rel = "external nofollo nofollow "rel =" external nofollow "rel =" externe nofollow "rel =" external nofollow "rel =" external nofollow "rel =" external nofollow "rel =" externe nofollow "rel =" external nofollow "rel =" external nofollow "rel =" external nofollow rel = "externe nofollow" rel = "externe nofollow" rel = "externe nofollow" rel = "external nofollow" rel = "external nofollow" rel = "external nofollow" rel = "external nofollo NOFORME "Rel =" Externe "Nofollow"> Blog </a> | <a href = "#" Rel = "Externe Nofold" Rel = "External Nofold" Rel = "External Nofollow" nofollow "rel =" external nofollow "> Politique de confidentialité </a> </ div> <p> ingongress.com, tous droits réservés. <span> </span> </p> </ div> <script src =" / cvc / central / js / cached_lay_reports.js "type =" text / javascrip src = "/ cvc / central / js / cached_lay_reports_cus.js" type = "text / javascript"> </ script> <div id = "mask"> </ div> <div id = "addLogo" style = "display: non; z-index: 12; width: 800px; hight: auto; margin-left: -50px;"> <div>; Style = "Font-Size: 16px; margin-left: 20px; couleur: #fff; margin-top: -5px;" id = "gn_title"> ajouter le menu </span> <a id = "close_modal"> × </a> </ div> <div id = "Addz"> <div id = "registre"> <form %> / webCenter.do "> <input type =" HIDDEN "name =" Method "value =" SaveorUpDateMenu "> <Input type =" HIDDEN "name =" PageIndex "value =" 1 "> <entrée type =" HIDDEN "name =" conid "value =" <% = conid%> "> <entrée type =" HIDDEN "name =" numb1 "value =" value = "<% = numb1> <% Type = "Hidden" name = "numb2" value = "<% = numb2%>"> <input type = "HIDDEN" id = "menuID" name = "menuID" value = "- 1"> <s table> <tr> <td> <span> nom de menu </ span> </ td> 0px; affichage: bloc en ligne; hauteur: 34px; "/> <span> </span> </td> </tr> <! - <Tr> <Td> Niveau de menu: </td> <td> <select id =" menu_level "name =" menu_level "Style =" margin: 10px 0px "> <option value =" - 1 "> Menu </ Option> <Option Value = "2"> Menu de deuxième niveau </ Option> </ SELECT> <span> </span> </pd> </tr> <tr id = "menu_parent_tr" style = "Affichage: Aucun"> <td> Menu parent: </td> <td> <select id = "menu_parent" name = "menu_parent" Style = "margin: 10px 0px"> <option = "- 1 style =" margin: 10px 0px = <option) Sélectionnez ... </ Option> </ Select> <span> </span> </td> </td> </tr> -> <tr> <td> Type de menu </td> <td> <Select ID = "Menutype" name = "Menutype" style = "margin: 10px 0px; affichage: Inline-block; width: 350px;"> <option Value = "- 1"> s'il vous plaît ... Value = "1"> Type d'image </ Option> <Option Value = "2"> Type de lien </ Option> </ SELECT> </td> </tr> <tr id = "imgtexttr" style = "Affichage: Aucun"> <Td> Contenu du texte </td> <td> <textarea Rows = "45" Cols = "70" name = "MenuContent" id = "menucant" Style = "Affichage: Inline-Block;"> </ TextArea> </td> </td> <tr id = "linktr" style = "Affichage: Aucun"> <td> Adresse de saute type = "text" id = "menuUrl" name = "menuUrl" style = "margin: 10px 0px" /> <span style = "margin: 10px 0px"> </span> </td> </tr> <tr> <td align = "Center" colpan = "2"> <hr style = "margin-bottom: 10px;"> <fant id = menu " Value = "add" style = "border-radius: 0; width: 260px; hauteur: 40px; margin: auto 50px; margin: 20px" /> </ td> </tr> </ table> </ form> </div> </div> </div> </div> <div id = "childmenu" style = "Affichage: Aucun; Z-index: 12; largeur: 650px; hauteur: auto; margin-left: -325px;"> <div id = "childz"> <div style = "margin-top: -40px;"> <span style = "font-size: 16px; margin-left: 20px; <a id = "close_modal"> </a> </ div> <div id = "registerDiv"> <table cellpacing = "0" style = "word-wap: break-word; Bribre de mots: Break-all; Table-Layout: Hériter; "> <Thead> <Tr> <th style =" Text-Align: Center "> Numéro </th> <thalign =" Center "Style =" Text-Align: Center "> Nom du menu </th> <th align =" Center "Style =" Text-aLIGN: Centre "> SECONDE </ TH> <TH ALLIGN =" Centre "STYLE =" Text-Align: Centre "> SECONDEM Menu </ th> <thalign = "Center" style = "text-align: Center"> Menu Type </ th> <th align = "Center" style = "text-adign: Center"> Modify </ th> <th align = "Center" style = "Text-Align: Center"> Delete </ Th> </ Tr> </ Table> </ Div> </ Div> </ving src = "<% = path%> / cvc / central / js / my97datepicker / wdatepicker.js"> </ script> <script src = "<% = path%> / cvc / central / js / setting.js" type = "text / javascript"> </ script> <script " src = "<% = path%> / cvc / central / js / validform_v5.3.2.js" type = "text / javascript"> </ script> <script charset = "utf-8" src = "<% = path%> / Train / js / bettrify / kningeditor.js"> </ script> <script charset = "utf-8" src = "<% = path%> / train / js / prettify / lang / zh_cn.js"> </ script> <script charset = "utf-8" src = "<% = path%> / trains / js / pretify / plugins / code / bettrify.js"> </cript> <script type = "text / javascript" src = "<%) %> / cvc / central / js / jQuery-1.10.2.min.js "> </ script> <script charset =" utf-8 "type =" text / javaScript "src =" <% = path%> / cvc / central / js / jquery-1.10.2.min.js "> </ script> <script charset =" utf-8 "type =" text / javas " src = "<% = path%> / central / js / jQuery-ui.min.js"> </ script> <cript> var editor1; * / if (menuname == "anglais") {alert ("Veuillez accéder au module d'information de base pour définir la conférence en cours chinois et anglais type");} else {$ .ajax ({url: "/ webCenter.do", "Post", dataType: "JSON", Data: "Method = ChangeMenState & Menud =" + Menud + "& Menuste) if (json.state == 1) {window.location.reload ();} else {alert ("modifier l'échec"); Animation Stop: Fonction (événement, ui) {// après la mise à jour du tri var catégories = $ ("# showTable"). }) niveau = 0; var contenu = "["; $ ("# showTable tr"). Chaque (fonction () {var niveau = $ (this) .children ("td"). 1) {Content + "{Niveau:" Niveau; URL: "<% = path%> / webCenter.do?upDateMelelevel", Type: "Post", DataType: "JSON", Data: "Menulist =" Content, Success: Function (JSON) {}})}}); $ ("# menu_level"). Change (function () {$ ("# menu_parent"). vide (); $ ("# menu_parent"). append ("<option value = '- 1'> s'il vous plaît sélectionnez ... </ option>") var level = $ ("# menu_level"). Val (); if (niveau == 1) {$ ("# menu_parent_tr"). 2) {$ .ajax ({url: "<% = path%> / webCenter.do?getFirstMenu", type: "get", dataType: "JSON", Success: function (result) {if (result! = Null && result! = "" && result.length> 0) {pour (var i = 0; i <résultat.Length; i ++) {var faction = "<option; Value = '"+ Result [i] .Menuid +"'> "+ Result [i] .menuname +" </opoption> "console.log (option) $ (" # menu_parent "). annex (option);}} else {alert (" non de niveau menu de niveau a encore été créé, "# menu de premier niveau");}}}) $ ("menu_pare_ter").).). }}) // sélectionnez le type graphique $ ("# menutype"). Change (function () {if ($ ("# menutype"). Val () == 1) {$ ("# imgtexttr"). Show (); $ ("# linktr"). Hide (); $ ("# addz"). CSS ("height", "450px")} if ($ ("# menutype"). Val () == 2) {$ ("# imgtexttr"). Hide (); $ ("# linktr"). Show (); $ ("# addz"). $ (# menu_name "). Val (); FALSE; Content "); return false;}} if ($ (" # menutype "). val () == 2) {if (menuUrl.trim () ==" "|| menuUrl.trim (). Length == 0) {alert (" s'il vous plaît entrez l'adresse de saut "); return false;}} var menuccount = <% = menulisting%>; $ (# menuID "). $ ("# addlg"). cliquez sur (fonction () {$ ("# mask"). show (); $ ("# addLogo"). show ();}) // annuler $ (". tk1_header"). cliquez (fonction () {emplacement.reload ();}) $ ("# close"). Click (function () {$ ("# zstype"). $ ("# zshref"). Val (""); $ ("# mask"). $ ("# addlogo"). show (); $ ("body"). Success: Function (Data) {$ (# menu_name "). Editor1.html (Data.Content);} if (data.meutype == 2) {$ ("# imgtext"). }}%>code d'action
@RequestMapping (params = "UpdateMenulevel", méthode = requestMethod.Post) public void updateMenuleVEL (String Menulist, httpservletRequest request, httpsservletResponse réponse) {try {httpSession session = this.getSession (request); Administrateur administrateur = session.getAttribute ("CenterAdminUser") == null? Null: (administrateur) session.getAttribute ("CenterAdMinUser"); if (administrateur == null) {try {réponse.SendRedirect (request.getContextPath () + "/ Centre / index.jsp"); } catch (exception e) {e.printStackTrace (); }} else {String conid = request.getSession (). getAttribute ("conid") == null? null: request.getSession (). getAttribute ("conid"). toString (); if (conid == null) {réponse.SendRedirect (request.getContextPath () + "/ Centre / index.jsp"); } JSONArray Array = JSONArray.FromObject (Menulist); for (int i = 0; i <array.size (); i ++) {jsonObject json = array.getjsonObject (i); Menu menu = WebService.getMenuById (json.getInt ("menuID")); menu.setLevel (json.getInt ("niveau")); WebService.SaveObject (menu); }}} catch (exception e) {e.printStackTrace (); }L'exemple ci-dessus de la table de mise en œuvre de Java Table T est tout le contenu que j'ai partagé avec vous. J'espère que vous pourrez vous faire référence et j'espère que vous pourrez soutenir Wulin.com plus.