Friday, 2 November 2012

Simple Chat box by using jQuery in JMVC framework

Ok so today we are going to make a simple Chat box by using jQuery.

Step 1: Create a apps by using C:/xampp/htdocs/jmvc> js  jquery\generate\apps mychat in console.

Step 2 : Generate the model by using C:/xampp/htdocs/jmvc> js  jquery\scaffold Mychat.Models.Chat in console.

Step 3 : Create the HTML in mychat.html file such as with body ID: #chat.

Step 4 : Write css for each class and ID for better look.

Step 5 : Write the controller logic in chat_controller.js file of controller folder of your apps such as:

There is nothing much about to discuss here, we introduce a new function here undelegate(), when out textarea1 or textarea2 are empty that at that time we do not want event hadler in our buttons, so this function simply remove the handler from the post button when our textarea is empty.

Step 6 : Now we connect our all files in mychat.js file by adding name 'chat' in controllers class (.controllers('chat')).

Step 7 : Now you can run your apps by opening mychat.html in any web browser.which look like as:

No comments:

Post a Comment