开发者

Calling a Javascript/JQuery function on postback for ASP.NET/C# page

开发者 https://www.devze.com 2023-03-01 15:26 出处:网络
I am working with a JQuery plugin called \'Tab Slide Out\' a link is here: http://wpaoli.building58.com/2009/09/jquery-tab-slide-out-plugin/

I am working with a JQuery plugin called 'Tab Slide Out' a link is here: http://wpaoli.building58.com/2009/09/jquery-tab-slide-out-plugin/

I am trying to use it as a feedback technique. On the slide out there is a form, and a submit button. Now when you hit submit, it of course causes a postback, and the page loads, but the feedback window is set back to its closed state. I want the window to be automatically open on postback. Here is an example of a website that uses the plugin and has it working how I want it to work: http://thedemo.ca/

Now I noticed in there script they have this on initial page load:

jQuery('.slide-out-div').tabSlideOut({
  tabHandle: '.handle',
  pathToTabImage: 'typo3conf/ext/stw_jquery_feedback/images/feedback-btn-right.png', 
  imageWidth: '32px',
  imageHeight: '167px',
  tabLocation: 'right',
  speed: 300,
  action: 'click',
  topPos: '200px',
  fixedPosition: true,
  onLoadSlideOut: false
});

And then this on po开发者_C百科stback from the submit button:

jQuery('.slide-out-div').tabSlideOut({
  tabHandle: '.handle',
  pathToTabImage: 'typo3conf/ext/stw_jquery_feedback/images/feedback-btn-right.png', 
  imageWidth: '32px',
  imageHeight: '167px',
  tabLocation: 'right',
  speed: 300,
  action: 'click',
  topPos: '200px',
  fixedPosition: true,
  onLoadSlideOut: true
}); 

Notice the last option of onLoadSlideOut changes. How is this possible? With that said I think the simplest solution would be to call click on the tabHandle, in turn sliding out the tab.

So I guess my real question is, how can I call click the .handle.

Here is a link to my test environment of my code: http://jakeism.info/test/


They are rendering the script dynamically. In asp.net the simplest way to do this would be something in your aspx/ascx like:

<script type="text/javascript">
jQuery('.slide-out-div').tabSlideOut({
  tabHandle: '.handle',
  pathToTabImage: 'typo3conf/ext/stw_jquery_feedback/images/feedback-btn-right.png', 
  imageWidth: '32px',
  imageHeight: '167px',
  tabLocation: 'right',
  speed: 300,
  action: 'click',
  topPos: '200px',
  fixedPosition: true,
  onLoadSlideOut: <% Response.Write(Page.IsPostBack ? "true" : "false") %>
}); 
</script>

Note the scriptlet for onLoadSlideOut. Now that logic probably won't do exactly what you want -e.g. any postback would cause it to be rendered open. So just substitute whatever is appropriate as a condition.

A nicer way to do this would be to post to a WebService using ajax, instead of posting the whole page, so you don't have a postback at all. Then just cleanly close the slideout after letting the user know that their feedback has been received.


I'd say you're best bet is to do the submission through an ajax call as you can then do some client side validation etc. and if successful you can slide it back in. The world is your oyster.

I'd recommend this route as if someone visits your site without javascript enabled the functionality will be limited, and your postback method will work fine (assuming the box is displayed automatically if not hidden on load of the page).

0

精彩评论

暂无评论...
验证码 换一张
取 消