+ Start a Discussion
sreejasreeja 

how to insert the record into the database using javascript and jquery

public class cmpinfocheck{
 
 
  
  
   public  list<Company_Information__c> cmpinfo{get;set;}
   
   public string empname{get;set;}
   
   
    public void cmpdata(){
     
     
     cmpinfo = new list<Company_Information__c>();
      
      
      Company_Information__c cm = new Company_Information__c();
      
      cm.name= empname;
       
     
      cmpinfo.add(cm);
        
        
     insert cmpinfo;
      
    }
    
    
    
    
    
 
 
 }
 
<apex:page controller="cmpinfocheck">
     
  <apex:form>
 <html>
 <head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head> 
  
   <script>

  function save(){
//how to deal with this type of scenario

};

</script>
  
 
   
   <body>
   
    <input type="text"  value="{!empname}"/>
    
   <button onclick="save()"> save</button>
   
   </body>
 
 </html>
 </apex:form>
</apex:page>

 
GovindarajGovindaraj
Hi Sree,

Your VF page should be like below,
<apex:page controller="cmpinfocheck"> 
   function save(){
     actionFunc(); //2.Call the ActionFunction
    }   
	<apex:form id="form"> 
		<apex:inputText value="{!empname}"/>
 		<apex:actionFunction name="actionFunc" action="{!cmpdata}" reRender="form"/> //3.Call the Apex method
		<apex:commandButton value="Save" onclick="save()" /> //1.Call the JavaScript method
	</apex:form> 
</apex:page>
Thanks,
Govindaraj.S
abhishek singh 497abhishek singh 497
Hello Sree,
Please find below code you can insert record through javascript no apex controller is involved here.


<apex:page id="Page" sidebar="false">
<script src="/soap/ajax/20.0/connection.js" type="text/javascript"></script>
<script>
function insertAccount(){
// Getting Session ID.
sforce.connection.sessionId = "{!$Api.Session_ID}";
//Creating New Account Record.
var account = new sforce.SObject("Account");
//Getting Account Name from inputText.
account.Name = document.getElementById("Page:Form:PB:PBS:PBSI:Name").value;
// This is the line where magic happens, calling Create() method.
var result = sforce.connection.create([account]);
if (result[0].getBoolean("success")) {
alert("New Account is created with id " + result[0].id);
} else {
alert("failed to create new Account " + result[0]);
}
}
</script>
<apex:form id="Form">
<apex:pageBlock title="Insert Account" tabStyle="Account" id="PB">
<apex:pageBlockSection title="Account Name" columns="1" id="PBS">
<apex:pageBlockSectionItem id="PBSI">
<apex:outputLabel value="Name" />
<apex:inputText title="Name" id="Name" />
</apex:pageBlockSectionItem>
</apex:pageBlockSection>
<apex:pageBlockButtons>
<apex:commandButton onclick="return insertAccount();" value="Save"/>
</apex:pageBlockButtons>
</apex:pageBlock>
</apex:form>
</apex:page>

Please let me know it helped you or not.
Please mark it best solution if your query is resolved.

Thanks & Regards,
Abhishek Singh.
sreejasreeja
hi govindaraj, and abhisek.. thanks for your reply, here my scenario is ..not to use the salesforce standared apex v.f components, i should have to use the bootstrap  inputs as a ui and   by using  button of bootstrap style or html css  button ,should have to  insert the data  into the salesforce database.. 

 //my doudt is how to call a apex class methods, in the html button, or a bootstrap button ..

 thanks and regards
sree

 
GovindarajGovindaraj
Hi Sree,

Then i believe you can use solution given by Abhisek,
<apex:page id="Page" sidebar="false">
<html>
<script>
function insertAccount() {
sforce.connection.sessionId = "{!$Api.Session_ID}";
var account = new sforce.SObject("Account");
account.Name = document.getElementById("idEmpName").value;
var result = sforce.connection.create([account]);
if (result[0].getBoolean("success")) {
alert("New Account is created with id " + result[0].id);
} else {
alert("failed to create new Account " + result[0]);
}
}
</script>

/* We can include bootstrap styles here */
<body id="body"> 
Account Name : <input id="idEmpName" type="text"/> 
<button onclick="insertAccount()"> Save</button> 
</body>
</html>
</apex:page>
Thanks,
Govindaraj.S