execute javascript from codebehind in asp.net

Question

I need to fire this script from code behind only on certain dates specified in the database

I need to show an image as a fancybox based on the date specified in CMS system.

I will write my logic to show image or not in the Default.aspx and then somehow pass this piece of code from default.cs to MarterPage Javascript $(window).load(function () Code Block

    <Script>
     $(window).load(function () {

    I want this code to fire at a particular location of master page. I am not sure suppose here.
///HERE???

    });
    </Script>

I want to pass below script as a value so that it js execute ///HERE??? part of code

Page.ClientScript.RegisterStartupScript(this.GetType(), "MyScript", "$('a.fancybox-messageboard').fancybox({ width: 600, height: 440,closeClick: true, hideOnOverlayClick: true, href: 'http://upload.wikimedia.org/wikipedia/commons/1/1a/Bachalpseeflowers.jpg'   }).trigger('click');", true);

I am bit lost with this ...

I simple want to do my logic check in Default.aspc file and show image as a fancy box only in default.aspx page. But my ' $(window).load(function () { });code block is in MasterPage file if i write another ' $(window).load(function () { }); in default.aspx file then fancy box is not showing properly.

How can i achieve this without any issue

UPDATE:

I managed to pull it off.. this is based on the solution posted by Irina Bogomaz.

So far this is working I can add full logic to code-behind later on.

    $(window).load(function () {

       if (window.showMessage) {
            // alert(imgPath);
            //logic to create fancybox
                    $("a.fancybox-messageboard").fancybox({
                        width: 600,
                        height: 440,
                        closeClick: true,
                        hideOnOverlayClick: true,
                        href: imgPath
                    }).trigger('click');
        }

   });


CODE BEHIND

    protected override void OnPreRender(EventArgs e)
    {
        string imgMB = "'http://upload.wikimedia.org/wikipedia/commons/1/1a/Bachalpseeflowers.jpg'";
        string sScript = "var showMessage = true; var imgPath=" + imgMB;
        Page.ClientScript.RegisterStartupScript(this.GetType(), "MyScript", sScript, true);
    }

score 2 · Answer 1 · answered Nov 20 '13 at 09:15

2

Try this:

string myscript = "$('a.fancybox-messageboard').fancybox({ width: 600, height: 440,closeClick: true, hideOnOverlayClick: true, href: 'http://upload.wikimedia.org/wikipedia/commons/1/1a/Bachalpseeflowers.jpg'   }).trigger('click');"

 ScriptManager.RegisterClientScriptBlock(this, this.GetType(), Guid.NewGuid().ToString(), "<script>" + myscript  + "</script>", false);

answered Nov 20 '13 at 09:15

Sandcar

872
1
8
21

@KnowledgeSeeker Did you check browser console for any errors that might be appening ? Maybe wrap your js script in a document.ready funcion helps . – Sandcar Nov 20 '13 at 09:33
It gives syntax error `SyntaxError: missing ) after argument list showMessage(http://upload.wikimedia.org/wikipedia/commons/1/1a/Bachalpseeflo – Learning Nov 20 '13 at 09:38
It doesnt not matter where i define my function whether in window load or jquery.load or anywhere i still get error `ReferenceError: showMessage is not defined` – Learning Nov 20 '13 at 09:48
@KnowledgeSeeker maybe something about script load order and the execution of the script. have you try register the script with ScriptManager.RegisterStartupScript signanture instead of RegisterClientScriptBlock ? sorry but I can not think of anything else to help you out – Sandcar Nov 20 '13 at 10:08

score 1 · Accepted Answer · answered Nov 20 '13 at 09:56

You can achieve this in the following way:

Master page:

<script type="text/javascript">
     $(window).load(function () {
         if (window.isFancybox) {
             //logic to create fancybox
         }
     });
</script>

Default.aspx.cs:

protected void Page_Load(object sender, EventArgs e)
    {
        var fanceBoxDate = new DateTime(2013, 11, 20); //get date from CMS system
        if (DateTime.Today == fanceBoxDate)
        {
            ScriptManager.RegisterClientScriptBlock(this, GetType(), "fancyBox", "var isFancybox = true", true);    
        }
    }

score 0 · Answer 3 · answered Nov 20 '13 at 09:04

may be u will use this way

first make aspx page to get service and use web method (_service.aspx)

    public partial class _service : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {

        }
        [WebMethod]
        [ScriptMethod(ResponseFormat = ResponseFormat.Json)]
        public static string binddata(yourObject yourDatabaseObject)//tbl_BI_mant[]
        {
            //connect to Database 
            //and add your Date filter
          return  Data.getpictureWithDateFilter(yourDatabaseObject.datefilter) 
        }
}

then in your default.aspx page call that service with jquery ajax

  $(function () {
  $.ajax({
                    url: '../_service.aspx/binddata',
                    type: 'POST',
                    data: "  {'yourDatabaseObject':" + JSON.stringify(Parameters) + "}",
                    datatype: 'html',
                    contentType: 'application/json; charset=utf-8',
                    success: function (data) {
                      $('a.fancybox-messageboard').fancybox({ width: 600, height: 440,closeClick: true, hideOnOverlayClick: true, href: 'http://upload.wikimedia.org/wikipedia/commons/1/1a/Bachalpseeflowers.jpg'   }).trigger('click');;
                    },
                    error: function (request, status, err) {
                        //   alert(status);
                        //alert(err);
                    }
                });
  });

execute javascript from codebehind in asp.net

3 Answers3