Javascript is it possible to move all my script files inside my html to another file -


i have simple dojo layout screen. wonder how can move javascript/dojo scripts file without affecting program?

here created button in body , reference in script. want still reference in js in different file.

below simple html code:

 <!doctype html>  <html >  <head>  <meta http-equiv="content-type" content="text/html; charset=utf-8"> <meta http-equiv="x-ua-compatible" content="ie=emulateie7" /> <link rel="stylesheet" href="js/dojo/dijit/themes/claro/claro.css">  <style type="text/css"> @import "js/dojo/dojox/grid/resources/clarogrid.css";  /*grid needs explicit height default*/ #form_div  {     width:600px;     border:2px solid black;     padding: 10px 10px 10px 10px; }  #grid_div {     width: 600px;     height: 20em; }  #addbutton_div { margin-left: 498px; }  #savebutton_div {     margin-left: 392px; }  </style> <script>dojoconfig = {async: true, parseonload: false}</script>  <script src="http://ajax.googleapis.com/ajax/libs/dojo/1.7/dojo/dojo.js">           </script> <script src="js/requireddojo.js" type="text/javascript"></script> <script src="branch layout js.js"> </script> <script>  var grid;    require(['dojo/_base/lang', 'dojox/grid/datagrid', 'dojo/data/itemfilewritestore', 'dojo/dom', 'dojo/domready!'], function(lang, datagrid, itemfilewritestore, dom){  /*set data store*/ var data = {   identifier: "id",   items: [] }; var data_list = [   { col1: "normal", col2: false, col3: 'but not followed 2 hexadecimal', col4: false},   { col1: "important", col2: false, col3: 'because % sign indicates', col4: true},   { col1: "important", col2: false, col3: 'signs can selectively', col4: false} ]; var rows = data_list.length; for(var = 0, l = data_list.length; < rows; i++){     data.items.push(lang.mixin({ id: i+1 }, data_list[i%l])); } var store = new itemfilewritestore({data: data});  /*set layout*/ var layout = [[   {'name': 'row #', 'field': 'id', 'width': '70px',     styles: 'text-align: center;'},   {'name': 'name', 'field': 'col1', 'width': '150px'},   {'name': 'desc', 'field': 'col2', 'width': '150px'},   {'name': 'code', 'field': 'col3', 'width': '90px',     styles: 'text-align: center;'},   {'name': 'is enable', 'field': 'col4', 'width': '100px',     type: dojox.grid.cells.bool, editable: true,      styles:          'text-align: center;'} ]];  /*create new grid*/ grid = new dojox.grid.datagrid({     id: 'grid',     store: store,     structure: layout,     rowselector: '20px'});     grid.placeat("grid_div");     grid.startup();      }); </script>  <script> require(["dojo/ready", "dijit/form/button", "dojo/dom"], function(ready,      button, dom){ ready(function(){     var mybutton = new button({         label: "&nbsp&nbsp&nbsp&nbspadd&nbsp&nbsp&nbsp&nbsp",         onclick: function(){             // something:         }     }, "add_btn");     });     }); </script>  <script>  require(["dojo/ready", "dijit/form/button", "dojo/dom"], function(ready,      button, dom){ ready(function(){     var mybutton = new button({         label: "&nbsp&nbsp&nbsp&nbsp&nbspsave&nbsp&nbsp&nbsp&nbsp&nbsp",         onclick: function(){         }     }, "save_btn");     });     }); </script>     <script>     require(["dojo/ready", "dijit/form/button", "dojo/dom"], function(ready,      button, dom){     ready(function(){     // create button programmatically:     var mybutton = new button({         label: "&nbsp&nbsp&nbsp&nbspclose&nbsp&nbsp&nbsp&nbsp",         onclick: function(){             // something:         }     }, "close_btn");     });     }); </script>   </head>  <body class="claro">  <div id="form_div"> <div id="addbutton_div">     <button id="add_btn" type="button"></button> </div> <div id="grid_div">  </div> <div id="savebutton_div">     <button id="save_btn" type="button"> </button>     <button id="close_btn" type="button"> </button>  </div>   </body>  </html> 

thanks in advance.


Comments

Popular posts from this blog

angular - Ionic slides - dynamically add slides before and after -

minify - Minimizing css files -

Add a dynamic header in angular 2 http provider -