Rectangle 27 1

One of the issues is that file uploading uses a different mechanism than the other form <input> types. That is why $this->input->post("userfile") isn't getting the job done for you. Other answers have suggested using javascript's FormData and this one does too.

A very simple form for picking a file and submitting it. Note the change from a simple button to <input type="submit".... Doing so makes it a lot easier for the javascript to use the FormData object.

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <script src="https://code.jquery.com/jquery-2.2.2.js"></script>
        <title>Upload Test</title>
    </head>
    <body>

        <?= form_open_multipart("upload/post", ['id' => 'uploader']); ?>
        <input type="file" name="userfile">
        <p>
            <input type="submit" value="Upload">
        </p>
        <?php echo form_close() ?>

        <div id="message"></div>

        <script>
            $('#uploader').submit(function (event) {
                event.preventDefault();
                $.ajax({
                    url: window.location.href + '/post',
                    type: "POST",
                    dataType: 'json',
                    data: new FormData(this),
                    processData: false,
                    contentType: false,
                    success: function (data) {
                        console.log(data);
                        if (data.result === true) {
                            $("#message").html("<p>File Upload Succeeded</p>");
                        } else {
                            $("#message").html("<p>File Upload Failed!</p>");
                        }
                        $("#message").append(data.message);
                    }
                });
            });
        </script>
    </body>
</html>

Use FormData to capture the fields. Note that instead of handling the button click we handle the submit event.

$('#uploader').submit(function (event) {
    event.preventDefault();
    $.ajax({
        url: window.location.href + '/post',
        type: "POST",
        dataType: 'json',
        data: new FormData(this),
        processData: false,
        contentType: false,
        success: function (data) {
            //uncomment the next line to log the returned data in the javascript console
            // console.log(data);
            if (data.result === true) {
                $("#message").html("<p>File Upload Succeeded</p>");
            } else {
                $("#message").html("<p>File Upload Failed!</p>");
            }
            $("#message").append(data.message);
        }
    });
});

I've added some code that "reports" results to ajax and will display it on the upload page.

class Upload extends CI_Controller
{
    public function __construct()
    {
        parent::__construct();
        $this->load->helper(['form', 'url']);
    }

    public function index()
    {
        $this->load->view('upload_v');
    }

    public function post()
    {
        $this->load->library("upload");
        $this->upload->initialize(array(
                "upload_path" => './uploads/',
                'allowed_types' => 'gif|jpg|png|doc|txt',
                "overwrite" => FALSE,
                "max_filename" => 300,
                "encrypt_name" => TRUE,
        ));

        $successful = $this->upload->do_upload('userfile');

        if($successful)
        {
            $data = $this->upload->data();
            $image_file = $data['file_name'];
            $msg = "<p>File: {$image_file}</p>";
            $this->data_models->update($this->data->INFO, array("image" => $image_file));
        } else {
            $msg = $this->upload->display_errors();
        }

        echo json_encode(['result' => $successful, 'message' => $msg]);
    }

}

This will upload your file. Your work probably isn't done because I suspect that your are not saving all the file info you need to the db. That, and I suspect you are going to be surprised by the name of the uploaded file.

I suggest you study up on how PHP handles file uploads and examine some of the similar codeigniter related questions on file uploads here on SO.

I don't know why but not working..

Forgot to mention this in the answer but I had to change the upload directory name from upload to uploads. Maybe you missed that? Other than data_models->update() which is a model I don't have the answer code worked for me. When you say, "not working." what exactly do you mean?

Thanks now working. The problem is in my php but i fixed it :)

success: function (data) {                 	console.log(data); }

But the file uploads OK?

javascript - Ajax upload not working codeigniter - Stack Overflow

javascript php jquery ajax codeigniter
Rectangle 27 2

There are several ways that your question can be accomplished. Hopefully this solution would give some ideas on how to accomplish this.

The solution below uses jquery ui dialog to display the modal and jquery .ajax to handle the login form submission.

Conditionally put this code at the bottom of you page before the </body> tag if the user is not logged in.

<?php if($this->auth->tank_auth->is_logged_in()){ ?>
    <div id="dialog-wrap" class="modal" >
    <?php echo $this->load->view('login_form'); ?>
    </div>
    <script>
        $('#dialog-wrap').modal({
            modal: true,
            autoOpen: true,
        });

        $('#login-form').submit(function(){
            //use .ajax to submit login form and check credentials.
            $.ajax({
                type: 'POST',
                url: <?php echo base_url(); ?>"login.php",
                data: "username="+$('username').val()+'&password='+$('password').val(),
                dataType: 'json',
                success: function(returnData){.
                    if(returnData.status){
                        //close modal box
                    }else {
                        //display message that login failed.
                    }
                }
            });

        });
    </script>
?>
function login(){

  //Use tank auth to validate login information.

  if(authentication is successful) {
    $return_data = array(
        'status'    => true,
        'msg'           => 'Login Successful'
    );
  }else {
        $return_data = array(
        'status'    => false,
        'msg'           => 'Login failed'
    );
  } 

  //Use echo instead of return when you are sending data back to an jquery ajax function.
  echo json_encode($data);
}

I think this code will do the same as the code snippet I've shown in the original post? Updated the original post with more specific details. Thanks!

php - Redirect to original page after logging in (Codeigniter) - Stack...

php jquery codeigniter session tankauth
Rectangle 27 2

There are several ways that your question can be accomplished. Hopefully this solution would give some ideas on how to accomplish this.

The solution below uses jquery ui dialog to display the modal and jquery .ajax to handle the login form submission.

Conditionally put this code at the bottom of you page before the </body> tag if the user is not logged in.

<?php if($this->auth->tank_auth->is_logged_in()){ ?>
    <div id="dialog-wrap" class="modal" >
    <?php echo $this->load->view('login_form'); ?>
    </div>
    <script>
        $('#dialog-wrap').modal({
            modal: true,
            autoOpen: true,
        });

        $('#login-form').submit(function(){
            //use .ajax to submit login form and check credentials.
            $.ajax({
                type: 'POST',
                url: <?php echo base_url(); ?>"login.php",
                data: "username="+$('username').val()+'&password='+$('password').val(),
                dataType: 'json',
                success: function(returnData){.
                    if(returnData.status){
                        //close modal box
                    }else {
                        //display message that login failed.
                    }
                }
            });

        });
    </script>
?>
function login(){

  //Use tank auth to validate login information.

  if(authentication is successful) {
    $return_data = array(
        'status'    => true,
        'msg'           => 'Login Successful'
    );
  }else {
        $return_data = array(
        'status'    => false,
        'msg'           => 'Login failed'
    );
  } 

  //Use echo instead of return when you are sending data back to an jquery ajax function.
  echo json_encode($data);
}

I think this code will do the same as the code snippet I've shown in the original post? Updated the original post with more specific details. Thanks!

php - Redirect to original page after logging in (Codeigniter) - Stack...

php jquery codeigniter session tankauth
Rectangle 27 2

There are several ways that your question can be accomplished. Hopefully this solution would give some ideas on how to accomplish this.

The solution below uses jquery ui dialog to display the modal and jquery .ajax to handle the login form submission.

Conditionally put this code at the bottom of you page before the </body> tag if the user is not logged in.

<?php if($this->auth->tank_auth->is_logged_in()){ ?>
    <div id="dialog-wrap" class="modal" >
    <?php echo $this->load->view('login_form'); ?>
    </div>
    <script>
        $('#dialog-wrap').modal({
            modal: true,
            autoOpen: true,
        });

        $('#login-form').submit(function(){
            //use .ajax to submit login form and check credentials.
            $.ajax({
                type: 'POST',
                url: <?php echo base_url(); ?>"login.php",
                data: "username="+$('username').val()+'&password='+$('password').val(),
                dataType: 'json',
                success: function(returnData){.
                    if(returnData.status){
                        //close modal box
                    }else {
                        //display message that login failed.
                    }
                }
            });

        });
    </script>
?>
function login(){

  //Use tank auth to validate login information.

  if(authentication is successful) {
    $return_data = array(
        'status'    => true,
        'msg'           => 'Login Successful'
    );
  }else {
        $return_data = array(
        'status'    => false,
        'msg'           => 'Login failed'
    );
  } 

  //Use echo instead of return when you are sending data back to an jquery ajax function.
  echo json_encode($data);
}

I think this code will do the same as the code snippet I've shown in the original post? Updated the original post with more specific details. Thanks!

php - Redirect to original page after logging in (Codeigniter) - Stack...

php jquery codeigniter session tankauth
Rectangle 27 0

as you are using codeigniter, try changing to:

...
var id = $(this).attr('id'); //you need to have 'id' attribute in your anchor
$("#loading").load("<?php echo site_url('site2/home2/); ?>" + id, function() {
    alert("aawa");
});
...

and in your controller file,

Update:: to put js variable in your site url, do:

var id = $(this).attr('id');
var second_param = "some value here";
var site_url = "<?php echo site_url('site2/home2/'); ?>" + id + "/" + second_param;
$("#loading").load(site_url, function() {
    alert("aawa");
});

and in your controller function

function some_function($your_id, $other_param) {
    do something with $your_id and $other_param
    //pass view as string
    echo $this->load->view('view_content', $data, TRUE);
}

addition:: in your home2() function your are trying to load view, change

$this->load->view('view_content',$data);
echo $this->load->view('view_content',$data, TRUE);

so that its returned as string to your .load() jquery function

I need to print value of the id inside the site_url var id = $(this).attr('id'); $("#loading").load('<?php echo site_url('site2/home2/.+id); ?>');

@GihanWijethunga see updated answer, you are not passing id properly

I need to get javascript variable into site_url() ** var id = $(this).attr('id'); $("#loading").load('<?php echo site_url('site2/home2/.'+id+'.); ?>');** I need to send id through the variable @Sudhir

@GihanWijethunga you can append 'id' to your site_url, and create a js variable and use it in .load() as in updated answer

you can pass in parameters from js like done in site_url above, as site_url + '/' + id1 + '/' + id2, and add arguments to your controller function like function some_function($param1, $param2) { ... }

php - codeigniter jquery ajax load view page - Stack Overflow

php jquery ajax codeigniter
Rectangle 27 0

$("#btn_preview").click(function(){
        var name=$('#txtName').val();
        var message=$('#txtMessageRequired').val();
        var tag = $("<div></div>");
        $(tag).attr("title", "Preview - Newsletter");
        $.ajax({
            type: "POST",
            data: {message: message, name: name},
            url: base_url+'index.php/newsletter/preview_newsletter',//Important: base_url is defined in the header section
            success:function(result){
                $(tag).dialog({
                    autoOpen: false,
                    show: {
                        effect: "blind",
                        duration: 1000
                    },
                    hide: {
                        effect: "explode",
                        duration: 1000
                    }
                });
                $(tag).dialog( "option", "width", 670 );
                $(tag).html(result).dialog().dialog('open');
            }
        });
    });

php - Load a Codeigniter view with Jquery Popup - Stack Overflow

php jquery codeigniter
Rectangle 27 0

<?php
if (!defined('BASEPATH'))
    exit('No direct script access allowed');

class Captcha_Controller extends CI_Controller
{

    // Load Helper in and Start session.
    function __construct()
    {
        parent::__construct();
        $this->load->helper('captcha');
        session_start();
    }
    // This function show values in view page and check captcha value.
    public function form()
    {
        if (empty($_POST)) {
            $this->captcha_setting();
        } else {
            // Case comparing values.
            if (strcasecmp($_SESSION['captchaWord'], $_POST['captcha']) == 0) {
                echo "<script type='text/javascript'> alert('Your form successfully submitted'); </script>";
                $this->captcha_setting();
            } else {
                echo "<script type='text/javascript'> alert('Try Again'); </script>";
                $this->captcha_setting();
            }
        }
    }
    // This function generates CAPTCHA image and store in "image folder".
    public function captcha_setting()
    {
        $values                  = array(
            'word' => '',
            'word_length' => 8,
            'img_path' => './images/',
            'img_url' => base_url() . 'images/',
            'font_path' => base_url() . 'system/fonts/texb.ttf',
            'img_width' => '150',
            'img_height' => 50,
            'expiration' => 3600
        );
        $data                    = create_captcha($values);
        $_SESSION['captchaWord'] = $data['word'];

        // image will store in "$data['image']" index and its send on view page
        $this->load->view('captcha_view', $data);
    }
    // For new image on click refresh button.
    public function captcha_refresh()
    {
        $values                  = array(
            'word' => '',
            'word_length' => 8,
            'img_path' => './images/',
            'img_url' => base_url() . 'images/',
            'font_path' => base_url() . 'system/fonts/texb.ttf',
            'img_width' => '150',
            'img_height' => 50,
            'expiration' => 3600
        );
        $data                    = create_captcha($values);
        $_SESSION['captchaWord'] = $data['word'];
        echo $data['image'];

    }
}
?>
<html>
    <head>
        <title>Add captcha using CodeIgniter</title>
        <link rel="stylesheet" type="text/css" href="<?php echo base_url(); ?>css/style.css">
        <link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro|Open+Sans+Condensed:300|Raleway' rel='stylesheet' type='text/css'>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
        <script type="text/javascript">
            // Ajax post for refresh captcha image.
            $(document).ready(function() {
            $("a.refresh").click(function() {
            jQuery.ajax({
            type: "POST",
            url: "<?php echo base_url(); ?>" + "index.php/captcha_controller/captcha_refresh",
            success: function(res) {
            if (res)
            {
            jQuery("div.image").html(res);
            }
            }
            });
            });
            });
        </script>
    </head>
    <body>
        <div class="main">
            <div id="content">
                <h2 id="form_head">Captcha Using Codelgniter</h2>
                <br/>
                <hr>
                <div id="form_input">
                    <?php
                        // Form Open
                        echo form_open();

                        // Name Field
                        echo form_label('Name');
                        $data_name = array(
                        'name' => 'name',
                        'class' => 'input_box',
                        'placeholder' => 'Please Enter Name',
                        'id' => 'name',
                        'required' => ''
                        );
                        echo form_input($data_name);
                        echo "<br>";
                        echo "<br>";

                        // Email Field
                        echo form_label('Email');
                        $data_email = array(
                        'name' => 'email',
                        'class' => 'input_box',
                        'placeholder' => 'Please Enter Email',
                        'id' => 'email',
                        'required' => ''
                        );
                        echo form_input($data_email);
                        echo "<br>";
                        echo "<br>";

                        echo "<div class='image'>";

                        // $image is the index of $data array. which will send by controller.
                        echo $image;
                        echo "</div>";

                        // Calling for refresh captcha image.
                        echo "<a href='#' class ='refresh'><img id = 'ref_symbol' src =".base_url()."img/refresh.png></a>";
                        echo "<br>";
                        echo "<br>";

                        // Captcha word field.
                        echo form_label('Captcha');
                        $data_captcha = array(
                        'name' => 'captcha',
                        'class' => 'input_box',
                        'color' => 'white',
                        'placeholder' => '',
                        'id' => 'captcha'
                        );
                        echo form_input($data_captcha);
                        ?>
                </div>
                <div id="form_button">
                    <?php echo form_submit('submit', 'Submit', "class='submit'"); ?>
                </div>
                <?php
                    // Form Close
                    echo form_close(); ?>
            </div>
        </div>
    </body>
</html>
body {
font-family: 'Raleway', sans-serif;
}
.main
{
width: 1015px;
position: absolute;
top: 10%;
left: 20%;
}
#form_head
{
text-align: center;
background-color: #FEFFED;
height: 66px;
margin: 0 0 -29px 0;
padding-top: 35px;
border-radius: 8px 8px 0 0;
color: rgb(97, 94, 94);
}
#content {
position: absolute;
width: 450px;
height: 490px;
border: 2px solid gray;
border-radius: 10px;
}
#content_result{
position: absolute;
width: 450px;
height: 192px;
border: 2px solid gray;
border-radius: 10px;
margin-left: 559px;
margin-top: -262px;
}
#form_input
{
margin-left: 50px;
margin-top: 36px;
}
label
{
margin-right: 6px;
font-weight: bold;
}
#form_button{
padding: 0 21px 15px 15px;
position: absolute;
bottom: 0px;
width: 414px;
background-color: #FEFFED;
border-radius: 0px 0px 8px 8px;
border-top: 1px solid #9A9A9A;
}
.submit{
font-size: 16px;
background: linear-gradient(#ffbc00 5%, #ffdd7f 100%);
border: 1px solid #e5a900;
color: #4E4D4B;
font-weight: bold;
cursor: pointer;
width: 300px;
border-radius: 5px;
padding: 10px 0;
outline: none;
margin-top: 20px;
margin-left: 15%;
}
.submit:hover{
background: linear-gradient(#ffdd7f 5%, #ffbc00 100%);
}
.label_output
{
color:#4A85AB;
margin-left: 10px;
}
#result_id
{
text-align: center;
background-color: #FCD6F4;
height: 47px;
margin: 0 0 -29px 0;
padding-top: 12px;
border-radius: 8px 8px 0 0;
color: rgb(97, 94, 94);
}
#result_show
{
margin-top: 35px;
margin-left: 45px;
}
.input_box{
height:40px;
width:240px;
padding:20px;
border-radius:3px;
background-color:#FEFFED;
margin-left:30px;
}
img {
margin-left: 97px;
}
input#name {
margin-left: 45px;
}
input#email {
margin-left: 50px;
}
img#ref_symbol {
margin-left: 275px;
margin-top: -36px;
}

Can you tell me what was the issue in my code which i have done

I am not saying that there is issue in your code i am asking what was the issue in my code so that i know right where i am making mistake

php - Unable to Display captcha image in codeigniter view - Stack Over...

php codeigniter captcha
Rectangle 27 0

$('a.menuitem').click(function() {
                    var link = $(this), url = link.attr("href");
                        var $newDiv = '<div></div>';
                        $("#content_pane").append($newDiv);
                        $newDiv.load(url);
                        return false; // prevent default link-behavior
            });

I havent tested that but it should work. If you can please report your result.

Alternatively you can create a variable that stores loaded content, wrap it into a div element and append created element to the #content_pane

It seems to half work, The content display on the page I want it to for about 1 second then just navigates to the page itself.

have you tried to accept loaded content in a variable and wrap it in a div?

That's close, but what the $ before newDiv? Unnecessary isn't it?

it is a good practice to add $ before variables that mean jquery object

php - Problem with my Jquery loading in my Codeigniter views - Stack O...

php javascript jquery codeigniter
Rectangle 27 0

I'm not sure what you're trying to do here. View files in CodeIgniter are supposed to contain HTML. The Controllers can load the views, and pass them data if need be. Views are templates.

$(this).load('<div id="test"></div>', function(){});

This will throw an error, as .load expects a URL, not HTML (unless you're binding to the onload event, where the 1st param can be an array of data, but I don't think that's what you're doing).

What I assume you want is to have jQuery load the content of the view file into #content. To do this, you're gonna need a controller that outputs the view. For example:

function slideshow(){
    $this->load->view('slideshow');
}
$("#slideshow").click(function() {
   $("#content").fadeOut(function() {
      $(this).load('/path/to/controller/slideshow', function() {
         $(this).fadeIn()
      });
   });
});

php - jQuery not properly loading a CodeIgniter view - Stack Overflow

php jquery codeigniter
Rectangle 27 0

This produces such a garbage that your browser will put it somewhere (at the beginning of the document):

$(this).load('<?php $this->load->view("slideshow"); ?>', function() {

Because the string needs proper encoding, e.g. as a javascript string with json_encodeDocs:

$(this).html(<?php echo json_encode($view_html); ?>);
$(this).fadeIn();
.load

@Rocket: An error? No idea, however I fixed the URL. Probably this needs a second json_encode?

$(this).load('<div id="test"></div>', function(){});
Syntax error, unrecognized expression: >
data://

this: en.wikipedia.org/wiki/Data_URI_scheme#JavaScript - nevermind not all browser support that URI there, I replaced it with just html() which does that.

php - jQuery not properly loading a CodeIgniter view - Stack Overflow

php jquery codeigniter
Rectangle 27 0

$(this).load("<?php $this->load->view('slideshow','','true'); ?>", function() { ......  }

Note that i use single quote, and third parameter true.

.load

php - jQuery not properly loading a CodeIgniter view - Stack Overflow

php jquery codeigniter
Rectangle 27 0

Building on what Mike put.. do this:

$('a.menuitem').click(function(e) { 
                    var link = $(this), url = link.attr("href"); 
                        var $newDiv = '<div></div>'; 
                        $("#content_pane").append($newDiv); 
                        $newDiv.load(url); 
                        e.preventDefault; // prevent default link-behavior 
            });

The e.preventDefault(); will stop the default action from occuring. Then it should not follow the link. Return False is usually used in the .submit() function. You'll need .preventDefault for the .click().

php - Problem with my Jquery loading in my Codeigniter views - Stack O...

php javascript jquery codeigniter
Rectangle 27 0

<script type="text/javascript">
    $(document).ready(function(){
    $(".company").click(function(e){
    e.preventDefault();
    var id = $(this).attr('id');
    $("#loading").load('<?php echo site_url('site2/home2/'); ?>'+id);
    alert(id);
    //alert("aawa");
    });
    });

php - codeigniter jquery ajax load view page - Stack Overflow

php jquery ajax codeigniter