-->

Monday, April 4, 2016

Delete selected item from DropdownList / Select List Using JQuery

In this article i will show you how to delete selected item from DropdownList/Select List Using JQuery. We all know that select/DropdownList contain option tag for value. So, the main logic behind the question is first to get the select list by using their id property then use option tag with selected attribute after that remove.
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default10.aspx.cs" Inherits="Default10" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="Scripts/jquery-1.10.2.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script>

        $(function () {
            $("#btdel").bind("click", function () {
                $("#fruitlist option:selected").remove();
            });
                    });


    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <select id="fruitlist">

        <option value="1">Mango</option>
        <option value="2">Apple</option>
        <option value="3">Orange</option>
        <option value="4">Grapes</option>



    </select>
        <input type="button" id="btdel" value="Delete" />
    </div>
    </form>
</body>
</html>

Saturday, June 28, 2014

Returns Radio Button Input element using Html.RadioButton() handler: MVC

Html.RadioButton() handler, used to return radio button input element to be input true or false value by user. Checked radio button will return true and un-checked will return false, otherwise it returns null to store/use the value.

Html.RadioButton() handler method is used to present mutually exclusive option i.e. true of false. Using this radiobutton method makes it easy to bind to view data or model is so easy in compare to using simple input radio element. This handler provides mostly same features as Html.CheckBox() handler discussed earlier.

Parameters


  • htmlHelper: specify html helper instance that this method extends.
  • name: specify name of input element used to access the value in controller.
  • value: specify value of radio button element. If none is assigned then this attribute is used to access the value.
  • isChecked: to be set true of false for radio button. True to select the element, OW false.
  • htmlAttributes: specify an object that contains html attributes to set for the element.
     e.g Html.RadioButton(“gender”)

Html.RadioButtonFor(…)

Having the same functionality as Html.RadioButton() but it returns radio button element for each property passed via the model from controller’s action. This handler have two types of type parameters i.e. TModel (specify type of model) and TProperty (specify type of value).

Parameters

  • htmlHelper: specify html helper instance that this method extends.
  • expression: used to identifies object containing the property to render.
  • value: specify value of radio button element. If none is assigned then this attribute is used to access the value.
  • htmlAttributes: specify an object that contains html attributes to set for the element.

e.g Html.RadioButtonFor(model=>model.Gender)

Render radio button input for the property gender passed via controller. Submitting form will assign the value of this radio button to model’s gender property to be accessed in the controller’s action.

Monday, June 9, 2014

Returns CheckBox Input element using Html.CheckBox() Handler: MVC

Html.CheckBox() handler, used to return check box input element to be input true or false value by user. Selected checkbox will return true and un-selected will return false, otherwise it returns null for the programmer to store/use the value.

In compare to other input element, this handler is easy to bind to with the data source provided by the programmer for the page. This handler/method have its own parameters list as Html.Label() or Html.TextBox() handlers have.

Parameters

  • Name: specifies the name of form field. It is string type of parameter.
  • isChecked: programmer should pass true to select the checkbox, otherwise false. As the name implies it is Boolean type of parameter.
  • htmlAttributes: specifies an object that contains all the html attributes to set for the element as discussed earlier.
@Html.CheckBox("isMarried", true);

This line will return an check box input element on the page with checked true value, as passed with the method. The name of form field will be isMarried, used to get the value of this element.

@Html.CheckBoxFor(…)

This handler works same as above but for a particular property in the object specified in the expression. This handler is used to return check box input for only the bind to property exists in the mode passed by an action to this view page.

Parameters are almost same except the expression which is a predicate to be bind this element with the specific property.

Let’s suppose this view page is bind to a model of type student having the properties like name, age, isMarried and etc. To bind this check box handler programmer have to write the following line of code:

@Html.CheckBoxFor(model => model.isMarried, false)

This handler now binds to isMarried property of the model and by default it will be un-selected on the page.

Tuesday, May 27, 2014

How to Render HTML Controls in View: Asp.Net MVC

Asp.Net MVC provides a way to write simple programming syntaxes and HTML Helpers convert them in to HTML at runtime to be simply open the pages at client end. These provides generates html and return result as a string.

Like other web form controls in Asp.Net, HTML helpers are used to modify HTML, but HTML Helpers does not have an event model/ view state as web form controls have. Programmer can use these helpers by using built in HTML property of the view that are in System.Web.Mvc.Html namespace. We can create our own Html helpers or use built-in provided in the specified namespace.

HTML helpers have methods for creating forms, rendering partial views, performing input validation etc. Here are some mostly used html helpers:

HTML Links

These type of links are used to render an html link on the page, but in MVC they create a link to redirect on a particular action of the controller.
        @Html.ActionLink(“Text to Display”, “Action-name”)

The first parameter is used to specify the text to be displayed for user and second parameter is used to specify the action-name to which user will redirect after click.

HTML BeginForm

To place a form element on MVC, following syntax is used that will create an HTML form with some parameter values listed below.

@using (Html.BeginForm())
{
//Other Html Helpers to complete the form
}

Parameters used 
  • ActionName: specify the name of action on which user will redirect
  • ControllerName: name of controller in which action has written
  • Route values: the values send as a parameter to action
  • FormMethod: Type of form whether HttpPost or HttpGet
  • Html attributes: used at run time like making readonly, applying css classes and more.

    ------------------------
Here are some standard html helpers used mostly when programming:

Wednesday, November 13, 2013

Introduction to HTML: Hyper Text Transfer Language

Introduction

HTML is a document - layout and hyperlink - specification language. It defines syntax and placement of special, embedded direction that are not displayed by the browser, but tell it how to display content of the document, including text, images, and other support media. The language also tells you to how to make a document interactive through special hypertext link, which connect your document with other documents.

HTML in brief

1. HTML stands for Hyper Text Markup Language.
2. HTML is not a programming language and used for data representation on web.
3. A markup language is a set of markup tags which describe how text should be displayed. 

HTML Tags

1. HTML tags are keywords surrounded by angle brackets like <html>
2. HTML tags are used in pairs like <b> and </b>
3. The first tag in a pair is the start tag (opening tag), the second tag is the end tag (closing tag). 

HTML File

1. An HTML file is a text file with HTML tags.
2. HTML file name must end with .htm or .html.
3. An HTML file is a simple text file so it  can be created using simple text editor.
4. An HTML file is often known as HTML document or a web page.

With all multimedia-enabling, new page layout features, and hot technologies that give life to HTML document over Internet. It is also important to understand the languages limitations : HTML is not a word processing tool, a desktop publishing solution, or even a programming language. Its fundamental purpose is to define the structure and appearance of document and document families so that they may be delivered quickly and easily to user. 

Structure of an HTML Document

An HTML document consists of :
1. Text: which defines the content of the document
2. Tags: which defines the structure and appearance of the document .

The structure of HTML document is simple , consisting of an outer <html> tag enclosing the document head and body :
<html>
  <head>
     <title>Title of page</title>
  </head>
  <body>
      This is an Example of simple <b>HTML document </b>
  </body>
</html>

HTML file is a plain text so it can be created using any text editor  and can be saved as filename.htm.
Each document has a head and a body, delimited by the <head> and <body> tags. The head where you give HTML document a title and where you indicate other parameters the browser may use when displaying the  document. The body is where you put the actual contents of HTML documents. This includes the text to display and document control markers (tags) that advise the browser how to display text. Tags also references special-effects files, including sound and graphics, and indicate the hyperlinks and anchors that are used to link document to other document.
© Copyright 2013 Computer Programming | All Right Reserved