locked
How to save input text value into database using asp.net RRS feed

  • Question

  • User-1640542475 posted

    Hi

    I have an issue how to save value in input value. I have added the "runat="server". If I add Runat server, data could not populate into input text control from

    card reader. If I remove runat server, data can populate, but could not save, error is not member....... 

    pls advice me.

    Thank  you in advance

    maideen

    Here is my code

    <script>
    function DisplayMyKAD(obj)
    {
    	var NL = "\n";
    	var out = "";
    	var out1 = "<b></b><br>";
    	if (obj.Photo != "") { 
            out1 += "<img src=\"data:image/jpg;base64," + obj.Photo + "\"></img>";
    	}
    
    	document.getElementById("mykad_info").innerHTML = 
    					out1 +
    					//"<b>Itemized Result:</b><br>" + 
    					"<textarea rows=\"16\" cols=\"120\" style=\"border:none;\">" + 
    					out +
            "</textarea>"
    
        //document.getElementById("imgIC").value = obj.out1;
        document.getElementById("Name").value = obj.Name;
        document.getElementById("NRICNo").value = obj.ICNo;
        document.getElementById("Gender").value =  obj.Gender;
        document.getElementById("DOB").value = obj.DOB;
        document.getElementById("BirthPlace").value = obj.BirthPlace;
        document.getElementById("Race").value = obj.Race;
        document.getElementById("Photo").value = obj.Photo;
    
    }
    function DisplayMyKAD_JSON(mykad_str) {
        //var out = "<b>MyKAD:</b><br>";
    	var obj = JSON.parse(mykad_str);
    	DisplayMyKAD(obj);
    }
    function getElement(xmldoc, tagname)
    {
    	if( typeof (xmldoc.getElementsByTagName(tagname)[0].childNodes[0]) == "undefined" ) {   
    		return "";
    	}
    	else {
    		return xmldoc.getElementsByTagName(tagname)[0].childNodes[0].nodeValue;
    	}
    }
    function quote(s) // return abc as "abc", needed in json string
    {
    	return "\"" + s + "\"";
    }	
    function DisplayMyKAD_XML(mykad_str) {
    	var json_str = "{";
    	parser = new DOMParser();
    	xmlDoc = parser.parseFromString(mykad_str,"text/xml");	
    	
    	// convert to json string
    	json_str += (quote("ERR_CODE") + ":" + quote(getElement(xmlDoc, "ERR_CODE")) + ",");
    	json_str += (quote("Name") + ":" + quote(getElement(xmlDoc, "Name")) + ",");
    	json_str += (quote("ICNo") + ":" + quote(getElement(xmlDoc, "ICNo")) + ",");
    	json_str += (quote("Gender") + ":" + quote(getElement(xmlDoc, "Gender")) + ",");
    	json_str += (quote("DOB") + ":" + quote(getElement(xmlDoc, "DOB")) + ",");
    	json_str += (quote("BirthPlace") + ":" + quote(getElement(xmlDoc, "BirthPlace")) + ",");
    	json_str += (quote("OldICNo") + ":" + quote(getElement(xmlDoc, "OldICNo")) + ",");
    	json_str += (quote("Addr1") + ":" + quote(getElement(xmlDoc, "Addr1")) + ",");
    	json_str += (quote("Addr2") + ":" + quote(getElement(xmlDoc, "Addr2")) + ",");
    	json_str += (quote("Addr3") + ":" + quote(getElement(xmlDoc, "Addr3")) + ",");
    	json_str += (quote("Postcode") + ":" + quote(getElement(xmlDoc, "Postcode")) + ",");
    	json_str += (quote("City") + ":" + quote(getElement(xmlDoc, "City")) + ",");
    	json_str += (quote("State") + ":" + quote(getElement(xmlDoc, "State")) + ",");
    	json_str += (quote("Race") + ":" + quote(getElement(xmlDoc, "Race")) + ",");
    	json_str += (quote("Nationality") + ":" + quote(getElement(xmlDoc, "Nationality")) + ",");
    	json_str += (quote("Left_FP_Verify_Status") + ":" + quote(getElement(xmlDoc, "Left_FP_Verify_Status")) + ",");
    	json_str += (quote("Right_FP_Verify_Status") + ":" + quote(getElement(xmlDoc, "Right_FP_Verify_Status")) + ",");
    	json_str += (quote("Photo") + ":" + quote(getElement(xmlDoc, "Photo")) + ",");
    	json_str += (quote("RegDate") + ":" + quote(getElement(xmlDoc, "RegDate")) + ",");
    	json_str += (quote("Version") + ":" + quote(getElement(xmlDoc, "Version")) + "}");
    	DisplayMyKAD_JSON(json_str) 
    }
    function GetMyKAD(fmt) 
    {
    	var method = "GET";
    	var url = "";
    	if (fmt == "JSON") {
    		url = document.getElementById("idURIJSON").value;
    	} else if (fmt == "XML") {
    		url = document.getElementById("idURIXML").value;
    	}
    	var xhr = new XMLHttpRequest();
    	xhr.onreadystatechange = function() {
    		if (this.readyState == 4) {
    			if (this.status == 200) {
    				document.getElementById("returntext").innerHTML = 
    					//"<b>Responseljljlj:</b><br>" + 
    					"<textarea rows=\"8\" cols=\"120\" style=\"border:none;\">" + 
    					//this.responseText +
    					"</textarea>";
    				if (fmt == "JSON") {
    					DisplayMyKAD_JSON(this.responseText);
    				} 
    				else if (fmt == "XML") {
    					DisplayMyKAD_XML(this.responseText);
    				}
    			}
    			else {
    				alert("Failed to get any data from the host.");
    			}
    		}
    	};
    
    	if ("withCredentials" in xhr) {
    		// Check if the XMLHttpRequest object has a "withCredentials" property.
    		// "withCredentials" only exists on XMLHTTPRequest2 objects.
    		xhr.open(method, url, true);
    	} else if (typeof XDomainRequest != "undefined") {
    		// Otherwise, check if XDomainRequest.
    		// XDomainRequest only exists in IE, and is IE's way of making CORS requests.
    		xhr = new XDomainRequest();
    		xhr.open(method, url);
    	} else {
    		alert("CORS is not supported by the browser");  // Otherwise, CORS is not supported by the browser.
    		xhr = null;
    	}
    	xhr.send();
    } // GetMyKAD
    
    <script>
    
    var myurlxml = "http://127.0.0.1/MYKAD/GetMyKAD?LoadPhoto=YES&VerifyFP=NO&Format=XML";
    var myurljson = "http://127.0.0.1/MYKAD/GetMyKAD?LoadPhoto=YES&VerifyFP=NO&Format=JSON";
    document.getElementById("idURIXML").value = myurlxml;
    document.getElementById("idURIJSON").value = myurljson;
    </script>
    
    
                <div class="row">
                    <div class="col-lg-3">
                        <asp:Label ID="Label15" runat="server" Text="Name" CssClass="txtsize"></asp:Label>
                        <input id="Name" type="text" name="Name"  class="form-control cbo txtsize" runat="server"  />
                    </div>
                    <div class="col-lg-1">
                        <br />
                        <button id="idGetMyKADXML" type="button" onclick="GetMyKAD('XML')" Class="btn btn-primary" style="width:100px"  >XML</button><br>      
                    </div>
                </div>
                <div class="row">            
                    <div class="col-lg-3">
                        <asp:Label ID="Label1" runat="server" Text="NRIC No" CssClass="txtsize"></asp:Label>
                        <input id="NRICNo" type="text" name="NRICNo" class="form-control cbo txtsize" runat="server" />
                    </div>
                </div>
                <div class="row">            
                    <div class="col-lg-3">
                        <asp:Label ID="Label2" runat="server" Text="Gender" CssClass="txtsize"></asp:Label>
                        <input id="Gender" type="text" name="Gender" class="form-control cbo txtsize" runat="server" />
                    </div>
                </div>
                <div class="row">            
                    <div class="col-lg-3">
                        <asp:Label ID="Label3" runat="server" Text="Date Birth" CssClass="txtsize"></asp:Label>
                        <input id="DOB" type="text" name="DOB" class="form-control cbo txtsize" runat="server" />
                    </div>
                </div>
                <div class="row">            
                    <div class="col-lg-3">
                        <asp:Label ID="Label4" runat="server" Text="Birth Place" CssClass="txtsize"></asp:Label>
                        <input id="BirthPlace" type="text" name="BirthPlace" class="form-control cbo txtsize" runat="server" />
                    </div>
                </div>
                <div class="row">            
                    <div class="col-lg-3">
                        <asp:Label ID="Label5" runat="server" Text="Race" CssClass="txtsize"></asp:Label>
                        <input id="Race" type="text" name="race" class="form-control cbo txtsize" runat="server" />
                    </div>
                </div>
                <div class="row">            
                    <div class="col-lg-11">
                        <asp:Label ID="Label6" runat="server" Text="Photo" CssClass="txtsize"></asp:Label>
                        <input id="Photo" type="text" name="BirthPlace" class="form-control txtsize" runat="server" />
                    </div>
                </div>
                <div class="row">
                    <div class="col-lg-5">
                        <br />
                        <asp:Button ID="btnSave" runat="server" Text="Submit" CssClass="btn btn-primary"  />
    
                     </div> 
                </div>
                <div class="row">    
                    <br />
    
                    <div class="col-lg-5">
                       <%-- <button id="idGetMyKADJSON" type="button" onclick="GetMyKAD('JSON')" Class="btn btn-primary" style="width:100px" >JSON</button><br>--%>
                    </div>
                </div>
                <div class="row">
                    <div class="col-lg-8" id ="idURIJSON">                    
                    </div>
                    <div class="col-lg-8" id="idURIXML">                 
                    </div>
               </div>
                <div class="row">
                    <div class="col-lg-6" id="mykad_info">
                    </div>
                    <div class="col-lg-6" id="returntext">
                    </div>
                </div>
    
    
    			
    Code behind Page
    
    Imports dbConnection
    Imports Microsoft.VisualBasic
    Imports System.Data
    Imports System.Data.SqlClient
    Imports System.Configuration.ConfigurationManager
    Imports System.Configuration
    
    Partial Class Help_MyKad
        Inherits System.Web.UI.Page
        Dim cmd As New SqlCommand
        Dim data As SqlDataReader
        Dim i As Integer
        Dim errmsg As String
    
        Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load
            If Not IsPostBack Then
    
            End If
        End Sub
    
        Private Sub InsertNRICData()
    
            cmd = New SqlCommand
            cmd.Connection = conn
            cmd.CommandType = CommandType.Text
            cmd.CommandText = "INSERT INTO Temp_MyKad ( Name, NRICNo, Gender, DOB, BirthPlace, Race, ImageType, ImageData)" &
                              " VALUES (@Name,@NRICNo,@Gender,@DOB,@BirthPlace,@Race,@ImageType,@ImageData)"
    
    
            Try
                conn.Open()
                cmd.Parameters.Add("@Name", SqlDbType.VarChar).Value = Name.Value
                cmd.Parameters.Add("@NRICNo", SqlDbType.VarChar).Value = NRICNo.Value
                cmd.Parameters.Add("@Gender", SqlDbType.Decimal).Value = Gender.Value
    
                cmd.Parameters.Add("@DOB", SqlDbType.VarChar).Value = DOB.Value
                cmd.Parameters.Add("@BirthPlace", SqlDbType.VarChar).Value = BirthPlace.Value
                cmd.Parameters.Add("@Race", SqlDbType.Decimal).Value = Race.Value
    
                cmd.Parameters.Add("@ImageType", SqlDbType.VarChar).Value = "image/.jpg"
                cmd.Parameters.Add("@ImageData", SqlDbType.VarChar).Value = Photo.Value
                cmd.ExecuteNonQuery()
    
            Catch ex As Exception
                ScriptManager.RegisterStartupScript(Me, Me.[GetType](), "Message", "alert('Error occured : " & ex.Message.ToString() & "');", True)
            Finally
                cmd = Nothing
                conn.Close()
            End Try
        End Sub
    
        Private Sub btnSave_Click(sender As Object, e As EventArgs) Handles btnSave.Click
            InsertNRICData()
        End Sub
    End Class
    
    
    
    			
    			
    
    

    Saturday, April 27, 2019 12:03 PM

Answers

  • User-685154102 posted

    Hi maideen5,

    When you use Runat=<g class="gr_ gr_73 gr-alert gr_gramm gr_inline_cards gr_run_anim Style replaceWithoutSep" id="73" data-gr-id="73">'server</g>' it makes the component as <g class="gr_ gr_102 gr-alert gr_gramm gr_inline_cards gr_run_anim Grammar only-ins replaceWithoutSep" id="102" data-gr-id="102">server</g> component. You can see the output <g class="gr_ gr_148 gr-alert gr_spell gr_inline_cards gr_run_anim ContextualSpelling ins-del multiReplace" id="148" data-gr-id="148">html</g> in <g class="gr_ gr_164 gr-alert gr_gramm gr_inline_cards gr_run_anim Grammar only-ins replaceWithoutSep" id="164" data-gr-id="164">console</g> when running your web application. You'll see a cryptic id suffixed in the name of server control. You need to use the ClientID of the server component when accessing it in Javascript.

    So for eg. in your case -

    <input id="NRICNo" type="text" name="NRICNo" class="form-control cbo txtsize" runat="server" />

    the corresponding reference to this server component would be -

    document.getElementById('<%= NRICNo.ClientID %>').value = obj.ICNo;
    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Sunday, April 28, 2019 7:10 AM

All replies

  • User-685154102 posted

    Hi maideen5,

    When you use Runat=<g class="gr_ gr_73 gr-alert gr_gramm gr_inline_cards gr_run_anim Style replaceWithoutSep" id="73" data-gr-id="73">'server</g>' it makes the component as <g class="gr_ gr_102 gr-alert gr_gramm gr_inline_cards gr_run_anim Grammar only-ins replaceWithoutSep" id="102" data-gr-id="102">server</g> component. You can see the output <g class="gr_ gr_148 gr-alert gr_spell gr_inline_cards gr_run_anim ContextualSpelling ins-del multiReplace" id="148" data-gr-id="148">html</g> in <g class="gr_ gr_164 gr-alert gr_gramm gr_inline_cards gr_run_anim Grammar only-ins replaceWithoutSep" id="164" data-gr-id="164">console</g> when running your web application. You'll see a cryptic id suffixed in the name of server control. You need to use the ClientID of the server component when accessing it in Javascript.

    So for eg. in your case -

    <input id="NRICNo" type="text" name="NRICNo" class="form-control cbo txtsize" runat="server" />

    the corresponding reference to this server component would be -

    document.getElementById('<%= NRICNo.ClientID %>').value = obj.ICNo;
    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Sunday, April 28, 2019 7:10 AM
  • User839733648 posted

    Hi maideen5,

    According to your description and code, I suggest that you could use asp:Textbox instead of input.

    The TextBox server control is an input control that lets the user enter text. 

    You could modify the code like:

    <asp:TextBox ID="Name" runat="server" CssClass="form-control cbo txtsize"></asp:TextBox>
    

    When you want to get Textbox value in Javascript, you should write like:

    document.getElementById('<%= Name.ClientID %>')

    Reference: https://docs.microsoft.com/en-us/dotnet/api/system.web.ui.webcontrols.textbox?view=netframework-4.8 

    Best Regards,

    Jenifer

    Monday, April 29, 2019 6:42 AM