I just recently started in Asp.Net MVC and I am just clueless at the moment. So my task is to localise text in .js files. My problem is that I can't seem to display this dialog label in my browser, the text I want to replace is "Remove A to B". I have tried using my variable 'a' by going 'this.a' in the place of this text but it doesn't work.
function Remove() {
var a = "";
this.Load = function () {
...`enter code here`
});
this.InitEventHandlers = function () {
$("#updateRemove").click(function (e) {
amplify.publish("UpdateRemove");
e.preventDefault();
});
$("#removeA").click(function () {
$("#removeA").dialog({
title: "Remove A to B",
width: 300,
autoOpen: true,
modal: true,
draggable: false,
resizable: false,
dialogClass: "RemoveB",
open: function () { $(this).appendTo("RemoveC"); }
});
});
...
you need to store the reference of 'this' because in the object inside the remove function the context is the current object.
do this:
function Remove() {
var that = this;
that.a = "";
$("#removeA").click(function () {
$("#removeA").dialog({
title: that.a,
you can read a little bit more here: http://javascript.crockford.com/private.html
Related
I Have a Messaging web application whose conversation page needs to check for a new message at a fixed interval (say 10 sec) and refresh itself if any new message available. I don't want to put a static HTML refresh as it causes page to reload even if no new message is there !
Any help is widely appreciated !!
You could try something like this:
(function($)
{
$(document).ready(function()
{
$.ajaxSetup(
{
cache: false,
beforeSend: function() {
$('#content').hide();
$('#loading').show();
},
complete: function() {
$('#loading').hide();
$('#content').show();
},
success: function() {
$('#loading').hide();
$('#content').show();
}
});
var $container = $("#content");
$container.load("page.php");
var refreshId = setInterval(function()
{
$container.load('page.php');
}, 9000);
});
})(jQuery);
How to get pass id value of button to jquery dialog on button click.
I don't want to pass value using query string.Is there any way that i can directly pass value using attributes or properties of jquery dialog.
View:
<input type="button" value="Create New" class="Create" id="1"/>
Jquery:
$(".Create").on("click", function (e) {
var Id=$(this).atrr('id');
$('#Load').empty();
//overflow: visible !important;
e.preventDefault();
$('#Load').dialog({
autoOpen: true,
modal: true,
draggable: true,
resizable: false,
height: 500,
width: 600,
position: { my: "center", at: "center", of: window },
dialogClass: 'fixed-dialog',
title: 'Create New Word',
open: function (event, ui) {
$(this).load("/Dictionary/_Create");
},
//close: function (event, ui) {
// window.location.href = window.location.href;
//}
});
return false;
});
You can change this line
var Id=$(this).atrr('id'); To BTW atrr is suppose to be attr
CurrentId = $(this).attr('id'); without the var
Then in the page /Dictionary/_Create you can simple access the CurrentId variable using javascript since it's global
Iam creating a button "SampleTest", which wil have to show the model data and "GoBack" button in popup window.But it displaying the content in full screen popup also overriding.Like,
i have my jquery like,
$('#SampleTest').button().click(function () {
var options = {};
options.type = "POST";
options.url = "/Dashboard/SampleTest/";
options.dataType = "json";
options.contentType = "application/json";
options.success = function (data) {
alert(data);
$(".popup").html(data);
$(".trasparentDiv").show(data);
$(".popup").show(data);
};
$.ajax(options);
});
Do i need to include any function in my jquery for popup window.Kindly tell me what to do in this case.
Please include JQuery UI script with appropriate version into your page after JQuery core script file.
Jquery UI CDN Path from JQuery: https://code.jquery.com/ui/
More help about Jquery Popup: http://jqueryui.com/dialog/
i have rewritten the code like,
function LoadSampleTest() {
alert('sample');
$("<div></div>")
.attr('id','SampleQuestionDiv')
.appendTo("body")
.dialog({
modal: true,
Close: function () {
$(this).dialog("close");
},
Width: 1000,
height: 800,
title: "Sample Test"
}).load("/dashboard/sampletest/");
Its works good.Instead of OK button, i have given close option to close the popup.
I have a jquery ui dialog that has a radio button list on it. I need to call a server side method when the user clicks ok and I need to pass the selected value. I tried doing it by calling an ajax method on and passing the selected value as a parameter. This worked great (the value was passed) but I could not access a cookie from the method (got error - Request is not available in this context), which makes sense being that this is an ajax request. Here is the code:
$("#dialogReject").dialog({
autoOpen: false,
height: 300,
width: 350,
modal: true,
buttons: {
"Reject": function () {
var value = $(this).find('input:checked').val();
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: "/myPage.aspx/RejectDocumentWM",
data: "{'rejectReason':'" + value + "'}",
dataType: "json",
success: function (data) {
alert('success');
},
error: function (result) { alert('error'); }
});
$(this).dialog('close');
},
Cancel: function () {
$(this).dialog("close");
}
}
});
RejectDocument():
[WebMethod]
public static void RejectDocumentWM(string rejectReason)
{
MyNamespace.myPage page = new MyNamespace.myPage();
page.RejectDocument(rejectReason);
}
protected void RejectDocument(string rejectReason)
{
batch batch = (batch)Session["Batch"];
if (client.RejectDocument(batch.GetCurrentDoc().icn, rejectReason, Request.Cookies["username"].Value)) //here is where I get the error
{
NextDocument();
}
}
I tried doing it by putting the value into a hidden field and then calling a button click which calls a server side method. My problem here was that the hidden field's value was always blank even though it set properly in the client script. Here is the code for that:
$("#dialogReject").dialog({
autoOpen: false,
height: 300,
width: 350,
modal: true,
buttons: {
"Reject": function () {
var value = $(this).find('input:checked').val();
$('[id$="hdfRejectReason"]').val(value); //this sets properly
$('[id$="btnRejectDoc"]').click();
$(this).dialog('close');
},
Cancel: function () {
$(this).dialog("close");
}
}
protected void btnRejectDoc_Click(object sender, EventArgs e)
{
batch batch = (batch)Session["Batch"];
if (client.RejectDocument(batch.GetCurrentDoc().icn, hdfRejectReason.Value, Request.Cookies["username"].Value))
//hdfRejectReason.Value is blank
{
NextDocument();
}
}
Any ideas for me? I am at my wits end.
Thanks!
First of All, is this hf is in 'popup' or in 'main page' section?
Second, in stackoverflow, we discused and set other (better?) way to set hidden field value in jQuery:
<div class="hfFoo-wrap">
<asp:HiddenField runat="server" ID="hfFoo" />
</div>
function FooBarFunction() {
var hfFoo = $('.hfFoo-wrap input[type=hidden]');
hfFoo.val('Bar');
var isBar = hfFoo.val();
}
Maybe in btnRejectDoc_Click have other 'null' or 'empty' params?
Third: I prefere FrameDialog with 'aspx' page and 'callback delegate'.
create popup as 'aspx' page
open popup from 'main page' by jQuery as jQuery.FrameDialog
close dialog from 'aspx-popup' as 'close popup' (jQuery.FrameDialog.closeDialog();)
on 'main page' catch callback delegate (with params from popup) and set hidden field there
I am quite new to JavaScript and jQuery, although I have often used jQuery UI Components, I barely made any modifications before. In this case, I needed to adjust the jQuery Slider to adjust the date, and I created something as the following: http://jsfiddle.net/ryn_90/Tq7xK/6/.
I'm happy with that so far, and now that I got the slider working as I would like it to, I would like to be able to bind a C# HiddenValue from the JavaScript attribute or from the HTML so I can save the date I have. Unless there is any better method to get this value to the backend...
So far I have been able to bind a JavaScript value from c# variables, but have not found out how to do it the other way round.
This is my javascript code:
<script>
$(function () {
$("#dialog").dialog({
autoOpen: false,
show: {
effect: "blind",
duration: 1000
},
hide: {
effect: "explode",
duration: 1000
}
});
jQuery(function() {
var dlg = jQuery("#sliderPopup").dialog({
draggable: true,
resizable: true,
show: {
effect: "blind",
duration: 1000
},
hide: {
effect: "explode",
duration: 1000
},
width: 320,
autoOpen: false,
minHeight: 10,
minwidth: 10
});
dlg.parent().appendTo(jQuery("form"));
});
$("#popupOpener").click(function () {
$("#dialog").dialog("open");
});
$("#sliderPopupOpener").click(function () {
$("#sliderPopup").dialog("open");
});
});
$(function () {
$("#slider").slider({
max: 30,
min: -30,
value: 0,
slide: function (event, ui) {
$("#days").val(ui.value);
$("#date").text(addDaysToDate(parseInt($("#days").val())));
},
create: function (event, ui) {
$("#date").text(addDaysToDate(parseInt($("#days").val())));
}
});
});
$("#days").val($("#slider").slider("value"));
$("#days").change(function (event) {
var data = $("#days").val();
if (data.length > -30) {
if (parseInt(data) >= 0 && parseInt(data) <= 30) {
$("#slider").slider("option", "value", data);
}
else {
if (parseInt(data) < -30) {
$("#days").val("-30");
$("#slider").slider("option", "value", "-30");
}
if (parseInt(data) > 30) {
$("#days").val("30");
$("#slider").slider("option", "value", "30");
}
}
}
else {
$("#slider").slider("option", "value", "0");
}
$("#date").text(addDaysToDate(parseInt($("#days").val())));
});
function addDaysToDate(days) {
var mths = new Array("Jan", "Feb", "Mar",
"Apr", "May", "Jun", "Jul", "Aug", "Sep",
"Oct", "Nov", "Dec");
var d = new Date(<%=deadlineYear%>, <%=deadlineMonth%>, <%=deadlineDay%>);
d.setHours(d.getHours() + (24 * days));
var currD = d.getDate();
var currM = d.getMonth();
var currY = d.getFullYear();
return mths[currM] + " " + currD + ", " + currY;
}
jQuery(function() {
var dlg = jQuery("#sliderPopup").dialog({
draggable: true,
resizable: true,
show: 'Transfer',
hide: 'Transfer',
width: 320,
autoOpen: false,
minHeight: 10,
minwidth: 10
});
dlg.parent().appendTo(jQuery("form"));
});
</script>
This is the asp.NET Code:
<div id="sliderPopup" title="Modify Deadline">
<div id="slider"></div>
<input type="text" id="days" value="0"/>
<div id="date"></div>
<asp:HiddenField ID="ModifiedDeadlineDateFromSlider" />
<asp:Button ID="DeadlineDateSave" Text="Save Deadline" runat="server" OnClick="saveDeadline" />
</div>
Please let me know if you need any more information. I would appreciate your answers and comments.
You can set the date value to the hidden field by adding just single line of code. Add the following code inside the slide event and the create event of your .slider function
$("#ModifiedDeadlineDateFromSlider").val(addDaysToDate(parseInt($("#days").val())));
or
$("#ModifiedDeadlineDateFromSlider").val($("#date").text());
Your .slider function will look like this after the modification.
$(function () {
$("#slider").slider({
max: 30,
min: -30,
value: 0,
slide: function (event, ui) {
$("#days").val(ui.value);
$("#date").text(addDaysToDate(parseInt($("#days").val())));
$("#ModifiedDeadlineDateFromSlider").val($("#date").text());
},
create: function (event, ui) {
$("#date").text(addDaysToDate(parseInt($("#days").val())));
$("#ModifiedDeadlineDateFromSlider").val($("#date").text());
}
});
});
P.S. Add the mentioned line of code to create event only if you want to set date in hidden field value on creation of slider also. If you want to set only if date is changes then just add that code in slide event only.
Note: In this particular scenerio it was not working with the changes also. So after discussion and couple of trials we discovered one more thing which was minor but created the problem. asp hidden field's property ClientIDMode was not set to static due to which its ID was changed during rendering and as a result value was not available in code behind late
Hope that helps!
To pass javascript value to c# do this way:
<script type="text/javascript">
function abc()
{
var str = "yourValue";
document.getElementById("HiddenField1").value = str;
}
</script>
and then access HiddenField1.Value on code-behind.
To pass c# variable to javascript you can bind public variable like this:
<%=this.YourVariable%>