Wednesday, January 28, 2009

WCF--- Foundation Programming Model

Addressing a service is essential to being able to use a service.
Address Section includes: Transport scheme, machinename(fully qualified domain name of the machine), port, path.
Addresses: HTTP, TCT, MSMQ, Pipes

Bindingss: the format to communicate with the service
The transport(HTTP, MSMQ,Named Pipes, TCP)
The channels(one-way, duplex, request-reply)
The encoding(XML, binary, MTOM...)

Messaging Exchange Patterns: Request-Reply(default pattern), One-Way(similar to calling an an asynchronous method with a void return type)
Duplex--- the both ends simultaneously acting as both a sender and a receiver.

Tuesday, January 13, 2009

.NET3.5 load XML class--- ObjectDataSource

public class CustomerDataProvider
{
public CustomerDataProvider(){}
private List Customers
{
get
{
XDocument xdoc = XDocument.Load(@"customers.xml");
List customers = new List();
IEnumerable iCustoms
= from C in xdoc.Descendants("customer")
orderby C.Attribute("CustomerID").Value
select new Customer
{
ID = C.Attribute("CustomerID").Value,
CompanyName = C.Attribute("CompanyName").Value,
ContactName = C.Attribute("ContactName").Value,
Address = C.Attribute("Address").Value,
ContactTitle = C.Attribute("ContactTitle").Value,
City = C.Attribute("City").Value,
Phone = C.Attribute("Phone").Value,
State = C.Attribute("State").Value,
ZipCode = C.Attribute("ZipCode").Value

};
customers = (List)iCustoms;
return customers;

}
}
public IEnumerable FindAll()
{
return this.Customers;
}
public IEnumerable FindById(string CustomerId)
{
return (from C in this.Customers where C.ID == CustomerId select C);
}
public void Update(Customer newCustomer)
{
Customer custm = this.Customers.Find(x => x.ID == newCustomer.ID);
custm.CompanyName = newCustomer.CompanyName;
custm.ContactName = newCustomer.ContactName;
custm.ContactTitle = newCustomer.ContactTitle;
custm.Address = newCustomer.Address;
custm.City = newCustomer.City;
custm.State = newCustomer.State;
custm.Phone = newCustomer.Phone;
custm.ZipCode = newCustomer.ZipCode;
}
}

jquery load xml and display in html

$(function(){
$.get('books.xml',function(d){
$('body').append(' <h1>Recommended Web Development Bookds</h1>');
$('body').append(' <dl>');
$(d).find('book').each(function(){

var $book = $(this);
var title = $book.attr("title");
var description = $book.find('description').text();
var imageurl = $book.attr('imageurl');

var html = ' <dt><img class="bookImage" alt="" src="http://www.blogger.com/" /> </dt>';
html += ' <dd><span class="loadingPic" alt="Loading">';
html += ' <p class="title">' + title + '</p>';
html += ' <p>' + description + '</p>' ;
html += '</dd>';

$('dl').append($(html));

$('.loadingPic').fadeOut(1400);
});

});
});</dl></span>
<span class="loadingPic" alt="Loading"></span>

Monday, January 12, 2009

JQuery post data to .ashx, pass to LINQ to SQL

First I create contact table which has contactId, name, email and comment. Then I create LINQtoSQL contact.dbml file.
Create new handler file call : SubmitDB.ashx. update the ProcessRequest method :

public void ProcessRequest (HttpContext context) {
var name = context.Request["name"];
var email = context.Request["email"];
var comment = context.Request["comment"];

ContactDataContext contactDB = new ContactDataContext();
Contact contact = new Contact();
contact.Name = name;
contact.Email = email;
contact.Comments = comment;
contactDB.Contacts.InsertOnSubmit(contact);
contactDB.SubmitChanges();
context.Response.Write("loading success");
}

On the front file: submitDataToDB.htm add the form method="post" action ="SubmitDB.ashx"
add container div:

<div id="container">
<label for="name">Name</label>
<input type="text" name="name" id="name" />

<label for="email">Email</label>
<input type="text" name="email" id="email" />

<label for="comment">Comment</label>
<textarea id="comment" name="comment" cols="35" rows="5">
</textarea>

<br />
<input type="button" id="submit" name="submit" value="Go" />
</div>

In Javascript, reference google javascript:



add another script:

$(function(){
$('#submit').click(function(){
$('#container').append('<img id="loadining" src="ajax-loader.gif" alt="loading"/>');
var name = $('#name').val();
var email = $('#email').val();
var comment = $('#comment').val();
// console.log(name,email, comment);
$.ajax({
url: 'SubmitDB.ashx',
type: 'POST',
data: 'name=' + name + '&email=' + email + '&comment=' +comment,

success:function(result)
{
$('#response').remove();
$('#container').append('<p id="response">'+ result+ '</p>');
$('#loadining').fadeOut(500,function(){
$(this).remove();
});
}
});

return false;
});
});

Friday, January 9, 2009

Resize Text in JQuery

$('a').click(function(){

var os = $('p').css('font-size');
var num = parseFloat(os, 10);
var um = os.slice(-2);
$('p').css('font-size', num / 1.4 + um);
if(this.id == 'larger')
{
$('p').css('font-size', num * 1.4 + um);
}

});

------ HTML-----




<a href="#" id ="larger">Larger</a>
<br>
<a href="#" id="smaller">Smaller</a>
<p>
Fits Single/Double Shopping Carts, High Chairs & Infant Swings!
</p>

Thursday, January 8, 2009

JQuery Hover Images


$(function(){
$('#container img').animate({
"opacity" : .5
});
$('#container img').hover(function(){
$(this).stop().animate({"opacity" :1});
},function(){
$(this).stop().animate({"opacity" : .5});
});
});