how to call a function of javascript in view of codeigniter - codeigniter

<script type="application/x-javascript">
addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false);
function hideURLbar() {
window.scrollTo(0,1);
}
</script>
I have that script. I want to call it in codeigniter view.
How can I call it by baseurl() or any thing else?

Include script into HTML by using base_url() function
<script src="<?php echo base_url('assets/listener.js'); ?>"></script>
Is this what your looking for? if not Explain further.

Related

Magento Autmatically redirect to a template file from another template file

I have a custom template file. There i am displaying a message. So after 10 second from the page load, i need to redirect to the admin login page automatically. I tried $this->_redirect('');. But that did not work.
Can anyone help me please. Thank You.
<script type="text/javascript">
setTimeout(function(){
window.location='<?php echo Mage::getBaseUrl().(string)Mage::getConfig()->getNode('admin/routers/adminhtml/args/frontName')?>';
}, 10000);
</script>
Put this script in your file it will works for you
The snippet below will resolve your question. If your site uses jquery, you may just paste this in your template. Otherwise, you need to include jquery in your Magento header.
<script>
jQuery(document).ready(function(){
setTimeout(function() { document.location = '<?php echo Mage::getUrl('adminhtml'); ?>'; }, 10000);
});
</script>

Simple AJAX query with CodeIgniter and jQuery

I'm simply trying to pull a div from a page called "Load-about.php" to my main page with AJAX.
I've been following tutsnet courses "30 Days to learn jQuery" but I'm stuck when it is about to load a content from another page since I'm using CI and I'm trying to adapt those courses.
So I have my main page:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Load</title>
<link rel="stylesheet" href="<?php echo base_url('bootstrap/css/bootstrap.min.css'); ?>" >
<style>
</style>
</head>
<body>
Try to make AJAX working !
</br>
Contact
<div class="wrap"></div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script>
(function() {
var wrap = $('div.wrap');
$('a').on('click', function(e) {
var href = $(this).attr('href');
wrap.load(href +'.container' ) ;
e.preventDefault();
});
})();
</script>
</body>
</html>
I'm simply calling a very simple CI Controller that only call the asked view
And Everything was working fine when working without the links.
But now, I am redirected to the page instead of using the AJAX call. Why ? Why does
e.preventDefault();
or
return false;
isn't preventing the links to their default action ?
Thanks
EDIT: Thanks to Jai, I found my error, a simple coma.
But, now, I'm getting "GET http://www.localhost.com/CodeIgniterJQUERY/index.php/Ajax/lessonTwentyThree/Load-Contact.container 500 (Internal Server Error) "
the problem comes from the .container as I wanted to specify the class and Ci understand it as it is a parameter.
Here is the Controller :
class Ajax extends CI_Controller {
/**
* Nous allons ici nous occuper de toutes les fcts AJAX
*/
public function lessonTwentyThree($page)
{ // En fait, on a pas besoin de ca, on va directement loader la vue directement.
$this->load->view($page);
}
}
I just want to grab a div from Load-Contact to the main page.
In addition to what Jai said. you have a codeigniter logical error.
when you say:
$this->load->view($page);
it means that codeigniter will redirect internally to the view. In your case what you need is to get back the view content and not to load it.
So, codeigniter support a third parameter with function view() that asks it to get the view content as String. you can do that and send the view to be loaded like this:
$string = $this->load->view($page, '', true);
echo $string;
Hope this will solve your problem
You have to move it up:
(function($) {
var wrap = $('div.wrap');
$('a').on('click', function(e) {
e.preventDefault();
var href = $(this).attr('href');
wrap.load(href +'.container' ) ;
});
})(jQuery);
and you have to put a ',' after click handler.
also try to change
(function() {
})();
to
$(function() {
});

CodeIgniter Ajax form - submitting form

I'm new to stackoverflow and to CodeIgniter and I'm currently experimenting on some simple code examples I have found on the Internet in order to get a start. The one I'm working on right now is a form which uses CI and Ajax (jQuery) along with saving the inputs of the form in a database and then display the most recent of them on the same page as the form.
If I confused you it's the 4.7 application example from here. The initial source code lies here but I have modified it in order to work with the latest release of CI and I quote all my MVC files just below.
Controller:
<?php
class Message extends CI_Controller
{
function __construct()
{
parent::__construct();
$this->load->helper('form');
$this->load->helper('url');
$this->load->helper('security');
$this->load->model('Message_model');
}
function view()
{
//get data from database
$data['messages'] = $this->Message_model->get();
if ( $this->input->is_ajax_request() ) // load inline view for call from ajax
$this->load->view('messages_list', $data);
else // load the default view
$this->load->view('default', $data);
}
//when we pres the submit button from the form
function add()
{
if ($_POST && $_POST['message'] != NULL)
{
$message['message'] = $this->security->xss_clean($_POST['message']);
$this->Message_model->add($message);
}
else
{
redirect('message/view');
}
}
}
?>
Model:
<?php
class Message_model extends CI_Model
{
function __construct()
{
parent::__construct();
$this->load->database();
}
function add($data)
{
$this->db->insert('messages', $data);
}
function get($limit=5, $offset=0)
{
$this->db->order_by('id', 'DESC');
$this->db->limit($limit, $offset);
return $this->db->get('messages')->result();
}
}
?>
Views
default.php:
<!-- called using message/view -->
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="<?php echo base_url('js/jquery-1.8.1.min.js'); ?>" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function()
{
$('#submit').click(function(e)
{
e.preventDefault();
var msg = $('#message').val();
$.post("", {message: msg}, function() {
$('#content').load("");
$('#message').val('');
});
});
});
</script>
</head>
<body>
<?php echo form_open("message/add"); ?>
<input type="text" name="message" id="message">
<input type="submit" value="submit" name="submit" id="submit">
<?php echo form_close(); ?>
<div id="content"></div>
</body>
</html>
messages_list.php:
<!-- called from ajax call -->
<ol>
<?php foreach ($messages as $cur): ?>
<li><?php echo $cur->message; ?></li>
<?php endforeach; ?>
</ol>
The problem mainly lies in the 1st of the views (default.php). That is, if I omit the e.preventDefault(); line from the javascript code then the form loads a different page (message/add as the form action parameter implies) which is a blank page, also cancelling the ajax behavior of my application that way.
On the other hand, if I actually add this line then the add method of my message controller isn' t called, thus not adding what I've typed into the database.
Finally, I tried the following js code instead of the other above:
$(document).ready(function()
{
$('#submit').click(function(e)
{
e.preventDefault();
var msg = $('#message').val();
$.post("<?php echo base_url(); ?>message/add", {message: msg}, function() {
$('#content').load("");
$('#message').val('');
});
});
});
but that way it seems as the $.post() crashes because nothing is executed in the function which is supposed to run on a successful post() call.
Any help appreciated and sorry for the big post. :)
You are correct that you must call e.PreventDefault();, but you must also deal with the response from the callback function, which you are not. The callback takes a few arguments but the first one is what you're interested in, it is the response from your server. I've denoted it as r below:
$(document).ready(function(){
$('#submit').click(function(e){
e.preventDefault();
var msg = $('#message').val();
$.post("<?php echo base_url(); ?>message/add", {message: msg}, function(r) {
//do something with r... log it for example.
console.log(r);
});
});
});
I've also removed $.("#content").load(...);. This would actually perform another AJAX request when the first one is complete.
Now, inspecting your controller...please refrain from using $_POST. CodeIgniter provides you with $this->input->post() as part of the Input Library. If you turn on Global XSS filtering in config/config.php you won't have to xss clean it either. You can clean on a post-by-post basis by using $this->input->post('name', true);
I recommend this instead:
function add(){
$m = $this->input->post('message', true);
if($m){
$this->Message_model->add($m);
}
}
The problem doesn't lie with the CI, its the JS that is wrong,
$(document).ready(function()
{
$('#submit').click(function(e)
{
e.preventDefault();
var msg = $('#message').val();
$.post("<?php echo base_url(); ?>message/add", {message: msg}, function() {
$('#content').load("<?php echo base_url(); ?>/message/view");
$('#message').val('');
});
});
});
The e.preventDefault() is used to stop the default behaviour of the submit button (which will take you to message/add), which we don't want. You are correct in adding the URl paramter to the $.post() function later, but in the callback function, the .load loads the URL that is passed to it into the #content, so without passing any url, of course there won't be anything to load.

Check ViewBag Value is present in javascript

I am using razor template and following is the scenario
$(function(){
//if (ViewBag.IsCallFunction){
somefunction();
//
//do something else
});
If a viewBag variable is present, i.e. not null and if it is set to true, then I would like to call some javascript function. How do I do this?
#{if(ViewBage.somevalue!=null && ViewBage.somevalue=="true")
{
<script type="text/javascript">
somefunction();
</script>
}
}
but remember this will get called as rendered, as per OP, you can't call it, you can render it, so call it inside document.ready when document is loaded
<script type="text/javascript">
$(function() {
#if (ViewData.ContainsKey("IsCallFunction") && ViewBag.IsCallFunction)
{
<text>somefunction();</text>
}
});
</script>
But I would recommend you using a view model instead of ViewBag, because in this case your code could be simplified:
<script type="text/javascript">
$(function() {
#if (Model.IsCallFunction)
{
<text>somefunction();</text>
}
});
</script>
You don't call a JavaScript function from Razor code because Razor runs on the server and JavaScript runs on the client.
Instead, you can emit JavaScript code to the client that then runs once the browser loads the HTML code generated by Razor.
You could do something like
<script type="text/javascript">
#* The following line is Razor code, run on the Server *#
#if (ViewData.ContainsKey("IsCallFunction") && ViewBag.IsCallFunction) {
#* The following lines will be emitted in the generated HTML if the above condition is true *#
$(function(){
somefunction();
//do something else
});
#} #* This is the closing brace for the Razor markup, executed on the Server *#
</script>

Call function from external .js file

I have a draw.js file with me which has a function as
var drawArrow=function(x1,y1,x2,y2)
{
// some code
}
In my html page in head I wrote
<script type="text/javascript" src="draw.js"></script>
<script type="text/javascript">
function callme() {
// insert code here
}
</script>
Please tell me waht code do I need to write in callme() to call drawArrow function of draw.js.
Nothing is external when you call js file all methods are easily accessible as it is create on same page now simply do this
<script type="text/javascript">
function callme() {
drawArrow=function(x1,y1,x2,y2);
// insert code here
}
</script>

Resources