0

I am trying to load the cropped image into the asp:image without using Updatepanel. But the problem is it displays the image but it needs to load the $('.image-cropper').each(linkUp); function which is present in the jQuery(window).load() to start the cropping process. But using the RegisterClientScriptBlock method it would not fire that function. Note: $('.image-cropper').each(linkUp); should be initiated only after the image has been updated with new image. Can anyone let me know where the error is?

using System;
using System.Collections.Generic;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using ImageResizer;
using System.Text;

public partial class Advanced : System.Web.UI.Page {

    protected void Page_Load(object sender, EventArgs e) {
        ScriptManager1.RegisterAsyncPostBackControl(Button1); 
        if(!IsPostBack)
            Image1.ImageUrl = "fountain-small.jpg?width=300";
        if (Page.IsPostBack && !string.IsNullOrEmpty(img1.Value)) 
        ImageBuilder.Current.Build("~/"+ImageResizer.Util.PathUtils.RemoveQueryString(img1.Value), "~/cropped.jpg", new ResizeSettings(img1.Value));
    }
    protected void Button1_Click(object sender, EventArgs e)
    {
        Image1.ImageUrl = "cropped.jpg?width=300";

        UpdatePanel1.Update();
        string key = "executeCropScript";
        Page.ClientScript.RegisterClientScriptBlock(this.GetType(), key, "<script      
type=\"text/javascript\">jQuery(window).load();</script>", false);


 }
}
2

2 Answers 2

1

use add attribute property of button.

e.g

Button1.Attributes.Add("onclick", "return:javascript functionname()");
Sign up to request clarification or add additional context in comments.

1 Comment

I could use this attribute property, but I would like to fire this function after I update the panel using c#. If I use like this, then first the client script fires and then the c# code behind . I have used the __do update panel and it worked. But I was trying to find a way that I could do the function calling through the code behind itself
0

you could try like this ...

     <html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>  
  <script>
  $(document).ready(function(){    
    $("button:first").click(function () {
      update($("span:first"));
    });
    $("button:last").click(function () {
      $("button:first").trigger('click');

      update($("span:last"));
    });

    function update(j) {
      var n = parseInt(j.text(), 10);
      j.text(n + 1);
    }
  });
  </script>
  <style>
  button { margin:10px; }
  div { color:blue; font-weight:bold; }
  span { color:red; }
  </style>
</head>
<body>
  <button>Button #1</button>
  <button>Button #2</button>
  <div><span>0</span> button #1 clicks.</div>
  <div><span>0</span> button #2 clicks.</div>
</body>
</html>

1 Comment

There are plenty of topics on this on StackOverflow, just search for 'jQuery Code behind'

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.