2013-10-30 103 views
0

場景:用戶輸入的名稱爲Textbox和結果通過jQueryUI$("#textboxElement").autocomplete({...})呈現。用戶選擇其中一個建議結果(全名(用戶名)),並顯示在#textboxElement中。用戶現在單擊名爲「權限」的button,該權限應返回填充到預先存在的HTML表中的選定用戶的權限列表。按鈕點擊應該進行用戶選擇,只提取兩個括號之間的最後一個用戶名,並作爲返回Permission對象列表的webservice的參數傳遞。填充搜索結果

問題:頁面上沒有任何反應。沒有顯示錯誤。其他jQUERYUI用戶控件遍佈整個頁面,不起作用。即使搜索不能與頁面上的其他按鈕點擊事件一起使用。 The Ajax code gives error (Unexpected ".)我在哪裏做事錯了?

jQueryUI的代碼:

$("#showPermission") 
         .button() 
         .click(function() { 

          var username = $('input:text[name=nameSearch]').val(); 
          //extracting a string of text that lies between two (parenthesis) from the end of the string 
          var result = username.split('('); 
           for (var i = 1; i < result.length; i++) { 
            $("#txtSelectedUsername").val(result[i].split(')')[0]); 
           } 
           $.ajax({ 
             type: "POST", 
             contentType: "application/json; charset=utf-8", 
             url: "Search.aspx/GetUserPermission", 
             data: "{'username':'" + $("#txtSelectedUsername").val() + "'}", 
             dataType: "json", 
             success: function (data) 
                { 
                 $.each(data, function(key, val) 
                 { 
                   var row = $("<tr />"); 
                   $("<td />").text(val.username).appendTo(row); 
                   $("<td />").text(val.level).appendTo(row); 
                   $("<td />").text(val.location).appendTo(row); 
                   $("<td />").text(val.role).appendTo(row); 

                   row.appendTo("table.usersPermissionTbl"); 

                 });​ 
                }, 
             error: function (xhr, textStatus, errorThrown) 
              { 
               var errorMessage = "Ajax error: " + this.url + " textStatus: " + textStatus + " errorThrown: " + errorThrown + " xhr.statusText: " + xhr.statusText + " xhr.status: " + xhr.status; 
               alert(errorMessage); 
                if (xhr.status != "0" || errorThrown != "abort") 
                { 
                 alert(xhr.responseText); 
                } 
              } 
             });//end of ajax 


         });//end of click event 

HTML

<table id="usersPermissionTbl" class="ui-widget ui-widget-content"> 
     <thead> 
      <tr class="ui-widget-header "> 
       <th>Username</th> 
       <th>Level</th> 
       <th>Location</th> 
       <th>Role</th> 
      </tr> 
     </thead> 
     <tbody> 
      <tr> 
       <td> </td> 
       <td> </td> 
       <td> </td> 
       <td> </td> 
      </tr> 
     </tbody> 
    </table> 

C#代碼

public static Permission[] GetUserPermission(string username) 
    { 
     List<Permission> allPermission = new List<Permission>(); 
     SqlConnection con = new SqlConnection(); 
     con.ConnectionString = connectionString; 

     string sqlString = "SELECT username, level, location, role from URTable WHERE username = '" + username + "'"; 
     SqlDataAdapter sadp = new SqlDataAdapter(sqlString, con); 
     DataSet ds = new DataSet(); 
     sadp.Fill(ds); 
     foreach (DataTable table in ds.Tables) 
     { 
      foreach (DataRow dtrow in table.Rows) 
      { 
       Permission permission = new Permission(); 
       permission.userName = dtrow["username"].ToString(); 
       permission.level = dtrow["level"].ToString(); 
       permission.location = dtrow["location"].ToString(); 
       permission.role = dtrow["role"].ToString(); 
       allPermission.Add(permission); 
      } 
     } 

     con.Close(); 
     return allPermission.ToArray(); 

    } 

    public class Permission 
    { 
     public string userName { get; set; } 
     public string level { get; set; } 
     public string location { get; set; } 
     public string role { get; set; } 
    } 
+0

你撥弄沒有HTML ... – drizzie

+1

您標記的方法的WebMethod? – Saranya

+0

@Saranya你是對的。我發現WebMethod標記缺失。添加它。 – shaz

回答

0

馬克在該方法中ASPX爲的WebMethod ..

1

  1. 下面缺少C#的方法@Saranya已經提及。

    [WebMethod] 
    [ScriptMethod(ResponseFormat = ResponseFormat.Json)] 
    
  2. 綁定到一個表是錯誤的,因此該解決方案是如下面

    success: function (data) { 
          var row; 
          $.each(data.d, function (key, value) { 
          row = '<tr>'; 
          row += '<td>' + value.userName + '</td>'; 
          row += '<td>' + value.level + '</td>'; 
          row += '<td>' + value.location + '</td>'; 
          row += '<td>' + value.role + '</td>'; 
          row += '</tr>'; 
          $(row).appendTo("#usersPermissionTbl"); 
         }); 
    
  3. 字符串提取assiging結果到一個文本框,其應該是一個變量。

    var username = $('input:text[name=nameSearch]').val(); 
              var name 
             var result = username.split('('); 
             for (var i = 1; i < result.length; i++) { 
              name = result[i].split(')')[0]; 
             }