Impossible d'obtenir le tag "jQuery Tag-it!"

J'utiliseImpossible d'obtenir le tag "jQuery Tag-it!"

jQuery Tag-it!

pour faire balise dans les champs d'entrée, mais après l'ajout de balises dans les champs d'entrée je veux récupérer lable et la valeur des champs d'entrée,

code html est :

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js" type="text/javascript" charset="utf-8"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.12/jquery-ui.min.js" type="text/javascript" charset="utf-8"></script> 
    <script src="Scripts/tag-it.js"></script> 
    <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/flick/jquery-ui.css"/> 
    <link href="Content/jquery.tagit.css" rel="stylesheet" /> 
    <script type="text/javascript"> 
     jQuery(document).ready(function() { 
      jQuery("#mytags").tagit({ 
       tagSource: function (request, response) { 
        $.ajax({ 
         type: "POST", 
         url: "WebForm1.aspx/GetKeyword", 
         data: "{'match': '" + request.term + "'}", 
         dataType: "json", 
         contentType: "application/json", 
         success: function (data) { 
          if (data.d != null) { 
           response($.map(data.d, function (item) { 
            return { 
             label: item.Name, 
             Value: item.Id 
            } 
           })); 
          } 
         } 
        }); 
       } 
      }); 
     }); 
     function myfunction() { 
      var tagStr = $("#mytags").tagit("tags") 
      alert("Got tags: " + tagStr); 
      $('#hiddenTags').val(tagStr); 
      return false; 
     } 
</script> 
</head> 
<body> 
    <form id="form1" runat="server"> 
    <div> 
    <div> 
     TO : 
    </div> 
     <ul id="mytags"> 
    </div> 
     <asp:Button ID="Button1" runat="server" Text="Send" OnClick="Unnamed1_Click" OnClientClick="myfunction();"/> 
    </form> 
</body> 
</html>

et code C# est:

public partial class WebForm1 : System.Web.UI.Page 
    { 
     protected void Page_Load(object sender, EventArgs e) 
     { 

     } 
     [WebMethod] 
     public static List<Info> GetKeyword(string match) 
     { 
      var qry = GetInfo().Distinct().Where(k => k.Name.ToLower().StartsWith(match.ToLower())); 
      return qry.ToList(); 
     } 

     public static IEnumerable<Info> GetInfo() 
     { 
      List<Info> list = new List<Info>(); 
      list.Add(new Info { Id = 1, Name = "Tom", Email = "[email protected]" }); 
      list.Add(new Info { Id = 2, Name = "Torex", Email = "[email protected]" }); 
      list.Add(new Info { Id = 3, Name = "Tresa", Email = "[email protected]" }); 
      list.Add(new Info { Id = 4, Name = "Morgan", Email = "[email protected]" }); 
      list.Add(new Info { Id = 5, Name = "Paris", Email = "[email protected]" }); 
      list.Add(new Info { Id = 6, Name = "Patrick", Email = "[email protected]" }); 
      return list; 
     } 

     protected void Unnamed1_Click(object sender, EventArgs e) 
     { 

     } 
    } 
    public class Info 
    { 
     public int Id { get; set; } 
     public string Name { get; set; } 
     public String Email { get; set; } 
    }

et quand je clique sur le bouton pour obtenir des valeurs de tag: enter image description here

Ce que je comptais obtenir des valeurs de bouton Envoyer sont: morgan, tom, patrick avec "id"

Source

2012-10-19 Arti Patel

var tagStr = JSON.stringifie ($ ("# mytags"). Tagit ("assignedTags")); , en utilisant ce que j'ai eu des valeurs lable, mais j'ai besoin "Id" –

essayer pour consigner le journal pour vérifier ce qui est à l'intérieur de l'objet, c'est peut-être un tableau, utilisez .each dans ce cas.

console.log("Got tags: " + tagStr);

Source

2012-10-19 11:47:34 henkieee

même valeur que je suis dans la boîte d'alerte :) [object Object] –

fix value l'orthographe de la propriété à la demande ajax gestionnaire d'événements success et utiliser ceci:

var tagStr = JSON.stringify($("#mytags").tagit("tags"));

et vérifier les sources de lien de plug-in sur lequel vous Affichée et qui ont utilisé.

Source

2012-10-19 11:49:11

en utilisant ce que j'ai eu des valeurs de lable, mais j'ai besoin ** "Id" ** –

@James , Je mettrais à jour ma réponse –

ok, mais http://webspirited.com/tagit/?theme=simple-green#demos, ici ils ont eu les deux valeurs –

corriger votre code:

code html est:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="default.aspx.cs" Inherits="DemoTagit._default" %> 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 
    <link href="css/jquery-ui-base-1.8.20.css" rel="stylesheet" type="text/css" /> 
    <link href="css/tagit-dark-grey.css" rel="stylesheet" type="text/css" /> 
    <link href="css/demo.css" rel="stylesheet" type="text/css" /> 
    <script src="js/jquery.1.7.2.min.js" type="text/javascript"></script> 
    <script src="js/jquery-ui.1.8.20.min.js" type="text/javascript"></script> 
    <script src="js/tagit.js" type="text/javascript"></script> 
    <script type="text/javascript"> 
     $(function() { 

      jQuery("#demo2").tagit({ 
       tagSource: function (request, response) { 
        $.ajax({ 
         type: "POST", 
         url: "default.aspx/GetKeyword", 
         data: "{'match': '" + request.term + "'}", 
         dataType: "json", 
         contentType: "application/json", 
         success: function (data) { 
          if (data.d != null) { 
           response($.map(data.d, function (item) { 
            return { 
             label: item.Name, 
             value: item.Id 
            } 
           })); 
          } 
         } 
        }); 
       }, 
       sortable: true, 
       triggerKeys: ['enter', 'comma', 'tab'] 
      }); 

      $('#demo2GetTags').click(function() { 
       showTags($('#demo2').tagit('tags')) 
      }); 

      function showTags(tags) { 
       console.log(tags); 
       var string = "Tags (label : value)\r\n"; 
       string += "--------\r\n"; 
       for (var i in tags) 
        string += tags[i].label + " : " + tags[i].value + "\r\n"; 
       alert(string); 
      } 

      $('#demo2ResetTags').click(function() { 
       $('#demo2').tagit('reset') 
      }); 
     }); 
    </script> 
</head> 
<body> 
    <div class="box"> 
     <div class="note"> 
      You can manually specify tags in your markup by adding <em>list items</em> to the 
      unordered list! 
     </div> 
     <ul id="demo2" data-name="demo2"> 
     </ul> 
     <div class="buttons"> 
      <button id="demo2GetTags" value="Get Tags"> 
       Get Tags</button> 
      <button id="demo2ResetTags" value="Reset Tags"> 
       Reset Tags</button> 
     </div> 
    </div> 
</body> 
</html>

code

est derrière:

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Web.Services; 

namespace DemoTagit 
{ 
    public class Info 
    { 
     public int Id { get; set; } 

     public string Name { get; set; } 

     public String Email { get; set; } 
    } 

    public partial class _default : System.Web.UI.Page 
    { 
     protected void Page_Load(object sender, EventArgs e) 
     { 
     } 

     [WebMethod] 
     public static List<Info> GetKeyword(string match) 
     { 
      var qry = GetInfo().Distinct().Where(k => k.Name.ToLower().StartsWith(match.ToLower())); 
      return qry.ToList(); 
     } 

     public static IEnumerable<Info> GetInfo() 
     { 
      List<Info> list = new List<Info>(); 
      list.Add(new Info { Id = 1, Name = "Tom", Email = "[email protected]" }); 
      list.Add(new Info { Id = 2, Name = "Torex", Email = "[email protected]" }); 
      list.Add(new Info { Id = 3, Name = "Tresa", Email = "[email protected]" }); 
      list.Add(new Info { Id = 4, Name = "Morgan", Email = "[email protected]" }); 
      list.Add(new Info { Id = 5, Name = "Paris", Email = "[email protected]" }); 
      list.Add(new Info { Id = 6, Name = "Patrick", Email = "[email protected]" }); 
      return list; 
     } 

    } 
}

Bonne chance! HungNM

Source

2013-03-08 04:36:25

Impossible d'obtenir le tag "jQuery Tag-it!"

Répondre

Questions connexes