forum

Home / DeveloperSection / Forums / How to change image on change url in textbox using jquery?

Ask Question

How to change image on change url in textbox using jquery?

Anonymous User205323-Feb-2015

Hi I’m trying to change image according to url on textbox.

This is my code:

<inputtype="text"name="org_img"id="org_img"class="input-xlarge"placeholder="/Images/default-1.jpg"value="/Images/default-1.jpg"/>
        <spanclass="pull-right"id="img_logo">
            <imgsrc="/Images/default-1.jpg"/>
        </span> 
 
function IsValidImageUrl(url, callback) {
        jQuery("<img>", {
            src: url,
            error: function () { callback(1); },
            load: function () { callback(0); }
        });
    }
 
    jQuery('#org_img').change(function () {
        var img_name = jQuery('#org_img').val();
        IsValidImageUrl(img_name, function (val) {
            if (val == 0)
                jQuery('#img_logo').html('<img src="' + img_name + '" width="300px" height="80px" />');
            if (val == 1)
                alert('Please Provide Valid URL Image');
            jQuery('#img_logo').html('<img src="/Images/default-1.jpg" />');
        });
    });

But this code is not work proper what’s problem I don’t know.

Please solve this problem.

Thank you in advance.

javascriptjquery 
Updated on 23-Feb-2015
Anonymous User

Anonymous User

Follow
I am a content writter !

Can you answer this question?

Answer

1 Answers

Anonymous User

Anonymous User

23-Feb-2015

Try this code I think this solution is solve your problem

<inputtype="text"name="org_img"id="org_img"value="/Images/default-1.jpg"/>
 
        <spanid="img_logo">
            <imgid="image_logo"src="/Images/default-1.jpg"/></span>
function IsValidImageUrl(url, callback) {
        jQuery("<img>", {
            src: url,
            error: function () { callback(1, null); },
            load: function () { callback(0, url); }
        });
    }
 
    $('#org_img').change(function () {
        var img_name = $(this).val();
        IsValidImageUrl(img_name, function (val, url) {
            if (val == 0) {
                $('#image_logo').attr('src', url);
            }
            if (val == 1) {
                alert('Please Provide Valid URL Image');
                $('#image_logo').attr('src', "/Images/default-1.jpg");
            }
        });
    });

Liked By