Hello,
I have found lots of articles explaining how to build tag clouds in ASP.NET, they are very good. I have been looking for a very simple tutorial on how to allow users to tag a database entry like a photo or news article, or anything really, like on this forum - where you add tags for a new post. I can't find any. I'm quite new to this, and I would be really grateful if somone could explain how I can build a page where users can tag stuff, using a single textbox and commas as a separator for each word. Thats the bit which confuses me the most!
Thank you very much!
Jack.
Hi Jack,
There's a few steps involved, so I'll try to keep it short...
First, add a "Tags" table with the following fields to the database that will hold all of your tags:
Tags
- tagID (Integer)(Primary Key)(Identity)
- tagText (varchar(255))
Next, let's assume you already have a table that stores your Articles, and it has a primary key field named: "articleID". You would then create another table to tie multiple tags to an article:
ArticleTags
- articleID (Integer)(Not Null)
- tagID (Integer)(Not Null)
Now, without getting too far into a discussion about good architecture - let's keep things simple. Let's create classes that define our Article, Tag and ArticleTag tables:
public class Article
{
public int articleID;
public string name;
public string body;
public Article(string name, string body)
{
this.name = name;
this.body = body;
}
public void Insert()
{
//code to save an article goes here
//once article is saved, set the generated articleID into this object
this.articleID = ArticleManager.Insert(this);
}
}
public class Tag
{
public int tagID;
public string tagText;
public Tag(string tag)
{
this.tagText = tag;
}
public void Insert()
{
//first, see if tag already exists
Tag tag = TagManager.GetByTagText(this.tagText);
if (tag == null) //assumes that above method returns null if matching tag not found
{
//once tag is saved, set the generated tagID into this object
this.tagID = TagManager.Insert(this);
}
else
{
//tag exists, grab the tagID
this.tagID = tag.tagID;
}
}
}
public class ArticleTag
{
public int articleID;
public int tagID;
public ArticleTag(int articleID, int tagID)
{
this.articleID = articleID;
this.tagID = tagID;
}
public void Insert()
{
ArticleTagManager.Insert(this);
}
}
Let's also create a helper class that holds multiple "Tag" objects:
public class TagList : List<Tag>
{
public TagList() { }
}
OK, that's the backend stuff done. Now all we need to do is get the tags from the user, parse them out and use these classes to save them to the database. Let's assume that we're on a page where we are creating a new Article and Tags for that article at the same time:
After the "Save" button is clicked, so the code goes here:
protected void btnSave_Click(object sender, EventArgs e)
{
//build up the new Article object
Article art = new Article(txtName.Text, txtBody.Text);
//now, let's grab the tags which are seperated by commas
TagList tList = new TagList();
string[] tags = txtTags.Text.Split(',');
//loop through the resulting array
foreach (string t in tags)
{
//first, make sure there's more than just a space
if (t.Trim().Length > 0)
{
Tag tag = new Tag(t.Trim());
//add tag to the list
tList.Add(tag);
}
}
this.mNewTagList = tList;
//now, save article and tags
art.Insert();
//make sure it saved and we have an articleID to use
if (art.articleID > 0)
{
//now save each tag, and create association between the tag and the article
foreach(Tag t in tList)
{
t.Insert();
//make sure we have a tagID to work with
if (t.tagID > 0)
{
//create a new association
ArticleTag at = new ArticleTag(art.articleID, t.tagID);
at.Insert();
}
}
}
}
That's it! Hope that helps!
Chad
