Capturing a value of a Key Press

July 6, 2009 at 1:13 pm (Javascript)

Capturing the value of  keyboard each keys can done using Javascript. Here we can implement the Key Press event in the input box. we can find the value using the following function.

<input type=”text” name=”keyVal” id=”keyVal” keypress=”keyDown(event)” />

function keyDown(e)
{
 dKey=(bw.ns)?e.which:event.keyCode;
// ie not case sensitive ?
dLet=String.fromCharCode(dKey);
dValues=”dKey=” + dKey+” dLet=” + dLet; alert(dValues);
}

The above function get invoked on each key press on the input box on the browser.

 

Leave a Comment

pagination

July 4, 2009 at 11:46 am (Ruby on Rail FrameWork)

pagination_mainRuby on Rails pagination functionalities done by installing the simple will_paginate plugin. This can be installed by using the following  command executed on your ruby for Windows,


Once installed, you need to include the plugin library as

c:\wamp\Ruby>gem install will_paginate

require ‘will_paginate’

in the config/environment.rb bottom after the  below code in the  .rb file,

Rails::Initializer.run do |config|
end

Live pagination in code:

Add the below code in your model to access by all the controller methods,

def display_data
if (page!=”)
 paginate(:all,:page => page, :conditions => ["user_id = ?", id], :per_page =>10)
 else
 paginate(:all,:page => 1, :conditions => ["user_id = ?", id], :per_page =>10)
 end

call the below function in your controller to invoke the paginate from the disaply_data as follows,

  @display_data = MessageHistory.more_update(params[:date],params[:page],session[:user_id])

Now here we need to show the pagination in the User view, for that we need to add the below code to invoke the pagination from the controller.

 <%= will_paginate @display_data %>

 Thats all  We have Compeleted the pagination. Once the above run sucessfully you will get the pagination like in the below format on your web page.

For the CSS updates goto this links and copy the CSS  and place it in your project folder (public/stylesheet)

http://www.dynamicdrive.com/style/csslibrary/item/css_pagination_links/

Leave a Comment

Floating Message Box

July 4, 2009 at 11:00 am (JQuery)

We can build a floating message box on fly in the browser depends on the scroll position of the window. This can be done using jquery simple few link code as seen below,

Here in the below code will fly message while on click  in submit button.Create a div tag, that going to become  a message box look on gly in the browser,

<div id=”message_box” ></div>

$(document).ready(function(){ 

$(‘#message_box’).css({visibility:’hidden’});

 $(window).scroll(function()
   {
       temp_sval=$(window).scrollTop();
    }
 );
 $(“.save_btn”).click(function(event){
  $(‘#message_box’).css({visibility:’visible’});
  $(“#message_box”).html(‘Settings Updated Sucessfully’); 
    $(‘#message_box’).animate({top:temp_sval+”px”,opacity:1 },{queue: false, duration: 350}); 
 setTimeout(function(){
  $(‘#message_box’).animate({ top:”+=15px”,opacity:0 }, “slow”);
 },1500);
 });

  
});

Leave a Comment