Solved

Calling PHP Function from Javascript - Ext-JS

Posted on 2010-08-24
5
1,598 Views
Last Modified: 2012-05-10
Hi Experts,

I have a JS file that is a login form which calls a PHP login script and returns true or false results however what I need is to manipulate the JS script to call a specific function called authenticate within the PHP script.  Below is the specifi piece of code that calls the PHP script and the change is required.  I have also included the entire JS script as well.  can you help?

buttons:[{
            
                text:'Login',
                formBind: true,       
                // Function that fires when user clicks the button
                handler:function(){
                    login.getForm().submit({
                        method:'POST',
                        waitTitle:'Connecting',
                        waitMsg:'Validating Identity...',
Ext.onReady(function(){
    Ext.QuickTips.init();
 
var login = new Ext.FormPanel({ 
//id: 'login-form',
bodyStyle: 'padding:15px;background:transparent',
border: true,
url:'login.php',
title:'Please Login',
frame:true,
defaultType:'textfield',
monitorValid:true,

items: [{
xtype: 'box',
autoEl: { tag: 'div',
html: '<img src="/extjs/qis_logo_small.png" class="app-img" /><br><br/>'}
},

{ xtype: 'textfield', id: 'userid',
fieldLabel: 'Userid',
allowBlank: false, blankText: 'userid is required', minLength: 3,
msgTarget:'side'
},

{ xtype: 'textfield', id: 'password',
fieldLabel: 'Password',
inputType: 'password',allowBlank: false, blankText: 'Password is required', minLength: 6,
msgTarget:'side'
}],

buttons:[{ 
		
                text:'Login',
                formBind: true,	 
                // Function that fires when user clicks the button 
                handler:function(){ 
                    login.getForm().submit({ 
                        method:'POST', 
                        waitTitle:'Connecting', 
                        waitMsg:'Validating Identity...',

						
 
			// Functions that fire (success or failure) when the server responds. 
			// The one that executes is determined by the 
			// response that comes from login.asp as seen below. The server would 
			// actually respond with valid JSON, 
			// something like: response.write "{ success: true}" or 
			// response.write "{ success: false, errors: { reason: 'Login failed. Try again.' }}" 
			// depending on the logic contained within your server script.
			// If a success occurs, the user is notified with an alert messagebox, 
			// and when they click "OK", they are redirected to whatever page
			// you define as redirect. 
 
                       						
						success:function(){ 
                        	Ext.Msg.alert('Status', 'Login Successful!', function(btn, text){
				   if (btn == 'ok'){
		                        var redirect = 'home.php'; 
		                        window.location = redirect;
                                   }
				   
			        });
                        },
 
			// Failure function, see comment above re: success and failure. 
			// You can see here, if login fails, it throws a messagebox
			// at the user telling him / her as much.  
 
                        failure:function(form, action){ 
                            if(action.failureType == 'server'){ 
                                obj = Ext.util.JSON.decode(action.response.responseText); 
                                Ext.Msg.alert('Login Failed!', obj.errors.reason); 
                            }else{ 
                                Ext.Msg.alert('Warning!', 'Authentication server is unreachable : ' +                                 action.response.responseText); 
                            } 
                            login.getForm().reset(); 
                        } 
                    }); 
                } 
            }] 
    });
//Ext.onReady(function() {
 var win = new Ext.Window({
    layout: 'form',
    width: 340,
    autoHeight: true,
    closable: false,
    moveable: true,
    border: false,
	resizable: false,
    items: [login]
});
    win.show();
});

Open in new window

0
Comment
Question by:Tbone3434
  • 2
  • 2
5 Comments
 
LVL 34

Expert Comment

by:Beverley Portlock
ID: 33516587
You need to read up on AJAX and the XMLHttpRequest object

http://en.wikipedia.org/wiki/XMLHttpRequest

It might be easier to use a framework and one that is developed specifically for PHP is SAJAX  http://sajax.info/
0
 
LVL 3

Expert Comment

by:SuchetaL
ID: 33518266
Is it when the form is submitted you want to call a specific PHP function say authenticate?

That is something you will have to manage in your PHP code. You can pass a hidden value in your form. This hidden value will help you decide which function to call from your submit script.


Hope that helps
Sucheta
0
 

Author Comment

by:Tbone3434
ID: 33523785
Yes it is when the form is submitted that I want to call the authenticate function within the PHP script.
0
 
LVL 3

Accepted Solution

by:
SuchetaL earned 500 total points
ID: 33528175
So, in your form add a hidden field -
<input type="hidden" id="function_to_call" name="function_to_call" value="a"/>


In your PHP script where your form is submitted - thats login.php

Check -
    if($_POST["function_to_call"] == "a") {
          // call authenticate function
         return authenticate();
    } else {
        // If you have other options ... they are called from here
    }
         
0
 

Author Closing Comment

by:Tbone3434
ID: 33532381
That was exactly what I needed...Thank You!
0

Featured Post

Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article discusses the difference between strict equality operator and equality operator in JavaScript. The Need: Because JavaScript performs an implicit type conversion when performing comparisons, we have to take this into account when wri…
International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
The viewer will learn how to count occurrences of each item in an array.
The viewer will learn how to look for a specific file type in a local or remote server directory using PHP.

733 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question