jquery - How to use Tagedit plugin in Asp.Net -


i want add tagedit plugin in project add names textbox. requirements are: 1. textbox should have autocomplete existing names. 2. should able accept new names if not found in existing data, similar tags textbox in stack overflow

below links plugin:

http://tagedit.webwork-albrecht.de/

http://tagedit.webwork-albrecht.de/playground.html

for purpose have used ajax json & webservice values database

step1: added controls aspx page

<form id="form1" runat="server">     <div>         <asp:toolkitscriptmanager id="toolkitscriptmanager1" runat="server">         </asp:toolkitscriptmanager>         <asp:textbox id="txtempnames" runat="server" ></asp:textbox>         <img alt="" src="" />     </div>     <input type="hidden" id="hfjsondata" />     </form>

step2: added related links of jquery , css page

<link href="app_styles/jquery-ui-1.10.2.css" rel="stylesheet" type="text/css" />     <link href="app_styles/crmstyles.css" rel="stylesheet" type="text/css" />     <link href="app_scripts/jqplugins/autocomplete/tagedit-master/css/jquery.tagedit.css"         rel="stylesheet" type="text/css" />     <script src="app_scripts/jquery-1.9.1.js" type="text/javascript"></script>     <script src="../../app_scripts/jquery-ui.min.js" type="text/javascript"></script>     <script src="app_scripts/jqplugins/autocomplete/tagedit-master/js/jquery.tagedit.js"         type="text/javascript"></script>

step3: added script data webservice

<script type="text/javascript">         $(document).ready(function () {             fngetemployess();             var localdata = [$("#hfjsondata").val()];             debugger;             $('#<%=txtempnames.clientid %>').tagedit({ autocompleteoptions: { source: localdata} });          });         function fngetemployess() {             var jsondata;             $.ajax({                 type: "post",                 url: "http://localhost:7253/webservice.asmx/getemployees",                 data: "{}",                 contenttype: "application/json; charset=utf-8",                 datatype: "json",                 success: function (response) {                      fnarrangedata(response.d);                 },                 failure: function (response) {                     alert('failed employees');                 }             });               var array = $("#hfjsondata").val();          }          function fnarrangedata(list) {             var array = new array();             (var = 0; < list.length; i++) {                 array.push("{\"value\":\"" + list[i].ename + "\",\"empno\":\"" + list[i].empno + "\",\"sal\":\"" + list[i].sal + "\"}");             }              $("#hfjsondata").val(array);         }     </script>

step4: added webservice code data database

[webmethod]         [scriptmethod(responseformat = responseformat.json)]   public list<empcls> getemployees()         {             list<empcls> employees = new list<empcls>();             list<emp> emps = new crmtestdatacontext().emps.tolist();             foreach (var item in emps)             {                 empcls em = new empcls                 {                     ename = item.ename,                     empno = item.empno,                     sal=item.sal                 };                 employees.add(em);             }             return employees;         }

step5: getting following results webservice

    <arrayofempcls>  <empcls><empno>1</empno><ename>johnson</ename><sal>18000.00</sal> </empcls><empcls><empno>2</empno><ename>harding</ename><sal>52000.00</sal> </empcls><empcls><empno>3</empno><ename>taft</ename><sal>25000.00</sal> </empcls><empcls><empno>4</empno><ename>hoover</ename><sal>27000.00</sal> </empcls><empcls><empno>5</empno><ename>lincoln</ename><sal>22500.00</sal> </empcls><empcls><empno>6</empno><ename>garfield</ename><sal>54000.00</sal> </empcls><empcls><empno>7</empno><ename>polk</ename><sal>25000.00</sal> </empcls><empcls><empno>8</empno><ename>grant</ename><sal>32000.00</sal> </empcls><empcls><empno>9</empno><ename>jackson</ename><sal>75000.00</sal> </empcls><empcls><empno>10</empno><ename>fillmore</ename><sal>56000.00</sal> </empcls><empcls><empno>11</empno><ename>adams</ename><sal>34000.00</sal> </empcls><empcls><empno>12</empno><ename>washington</ename><sal>18000.00</sal> </empcls><empcls><empno>13</empno><ename>monroe</ename><sal>30000.00</sal> </empcls><empcls><empno>14</empno><ename>roosevelt</ename><sal>35000.00</sal>  </empcls></arrayofempcls>

step6: have changed webservice response jquery array using step 3

{"value":"johnson","empno":"1","sal":"18000"}, {"value":"harding","empno":"2","sal":"52000"}, {"value":"taft","empno":"3","sal":"25000"}, {"value":"hoover","empno":"4","sal":"27000"}, {"value":"lincoln","empno":"5","sal":"22500"}, {"value":"garfield","empno":"6","sal":"54000"}, {"value":"polk","empno":"7","sal":"25000"}, {"value":"grant","empno":"8","sal":"32000"}, {"value":"jackson","empno":"9","sal":"75000"}, {"value":"fillmore","empno":"10","sal":"56000"}, {"value":"adams","empno":"11","sal":"34000"}, {"value":"washington","empno":"12","sal":"18000"}, {"value":"monroe","empno":"13","sal":"30000"}, {"value":"roosevelt","empno":"14","sal":"35000"}

now when running page neither getting error nor plugin working. request members me out in case. in advance help.


Comments

Post a Comment

Popular posts from this blog

Eclipse formatter for java ending braces -

i know if it's possible setup eclipse format braces using banner style. we're working code uses banner style formatting , keep consistent within team version control reasons. here's example of banner style formatting not familiar: public class foo { //------------------------ public static void main (string[] args) { boolean condition = true; try { if (condition) { system.out.println ("condition true"); } else system.out.println ("not condition"); } catch (exception ex) { // handle errors } } //------------------------ } update: name style ratliff. experiment java->code style->formatter preferences. "banner style" seems poor use of space given outline view , quick outline functionality.
Read more

ruby - Nesting modules inside of a Rails eninge gem -

what proper syntax nest child modules within parent module being isolate_namespace rails engine gem? # lib/myengine/engine.rb module myengine class engine < rails::engine isolate_namespace myengine # def ... end end for example. parent module myengine , child module blog. myengine share common domain, crud, taggable, searchable, etc, keep gem code dry , isolated main app (myapp), while inheriting isolated namespace , engine. are either of 2 approaches correct? refactor advice? # # lib/myengine/blog.rb module myengine module blog # def ... end end # b # lib/myengine/blog.rb module myengine class engine < rails::engine isolate_namespace myengine module blog # def ... end end end option a. correct, should lib/my_engine/blog.rb . can read more ruby & rails naming conventions here . further, if want put more modules or classes under blog namespace put them in folder lib/my_engine/blog , nest them under myengine::bl...
Read more

php - Why I am getting the Error "Commands out of sync; you can't run this command now" -

the documentation of error mentioned in title says if commands out of sync; can't run command now in client code, calling client functions in wrong order. this can happen, example, if using mysql_use_result() , try execute new query before have called mysql_free_result(). can happen if try execute 2 queries return data without calling mysql_use_result() or mysql_store_result() in between. from here: http://dev.mysql.com/doc/refman/5.0/en/commands-out-of-sync.html but in first query not fetching data mysql database, inserting. , in second query getting data database. here code $connection = mysqli_connect("localhost","username","password","tbl_msgs"); if(mysqli_connect_errno($connection)) { die("failed connect mysql: " . mysqli_connect_error()); } $query = "insert users (total_comments, total_views) values ({$total_comments}, {$total_views});"; $query .= "insert msgs (no...
Read more