Sorry if the question is really dumb, however, I couldn't find how to solve it.
I have a very simple methid in a controller:
public string ExactSeconds()
{
string str = DateTime.Now.Second.ToString();
return str;
}
The view is simpler than the method:
<p id="rData"></p>
<p id="qqqqq">click me!</p>
JavaScriptCode:
<script type="text/javascript">
$(document).ready(function () {
$('#qqqqq').click(function () {
alert('');
var url = "/Home/ExactSeconds";
$.get(url, null, function (data) {
$("#rData").html(data);
});
});
});
});
However, When I click at id="qqqqq", then it just uploads data(seconds) just for the first time. Then if I click the second time and the next times, then alert('') works perfectly, however it is not called method ExactSeconds, that is I cannot see updated seconds at the view.
How to call method ExactSeconds() always when I click at #qqqqq?
When I remove your AJAX calls, this works fine.
$(document).ready(function () {
$('#qqqqq').click(function () {
alert('');
$("#rData").html(Date.now);
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p id="rData"></p>
<p id="qqqqq">click me!</p>
Secondly, why do you have nested one AJAX get call inside another. How about just one call?
$(document).ready(function () {
$('#qqqqq').click(function () {
alert('');
var url = "/Home/ProverbPartialView";
$.get(url, null, function (data) {
$("#rData").html(data);
});
});
});
<script type="text/javascript">
$(document).ready(function () {
$('#qqqqq').click(function () {
alert('');
var url = "/Home/ProverbPartialView";
$.get(url, null, function (data) {
$.get(url, null, function (data) {
$("#rData").empty();
$("#rData").html(data);
});
});
});
});
Try this by adding $("#rData")..empty(); in the code
Related
I have two buttons. One Button refreshes the table (html table) with a ajax php request. And there is another button to refresh it every 10 seconds. If I try to access the document it throw a lot of errors that I don't know about how to solve the problem.
My Javascript Code is here:
<script>
$(document).ready(function(){
$("#reloadLoginActivities").click(function(){
$("#loginActivities").load("https://www.prodigy-official.de/resources/php/website_utilities.php", {
function: "loadTenLatestLoginActivities"
});
});
$("#liveUpdateLoginActivities").click(setInterval(function(){
$("#loginActivities").load("https://www.prodigy-official.de/resources/php/website_utilities.php", {
function: "loadTenLatestLoginActivities2"
},10000);
}));
});
</script>
I get a lot of errors in : https://prnt.sc/pp33s1
My jQuery File is here: https://www.prodigy-official.de/resources/js/jquery-3.3.1.min.js
I think that your formation is not correct.
$(document).ready(function(){
$("#reloadLoginActivities").click(function(){
$("#loginActivities").load("https://www.prodigy-official.de/resources/php/website_utilities.php", {
function: "loadTenLatestLoginActivities"
});
});
$("#liveUpdateLoginActivities").click(setInterval(function(){
$("#loginActivities").load("https://www.prodigy-official.de/resources/php/website_utilities.php", {
function: "loadTenLatestLoginActivities2"
});
}, 10000));
});
$(document).ready(function () {
$("#reloadLoginActivities").click(function () {
$("#loginActivities").load("https://www.prodigy-official.de/resources/php/website_utilities.php", {
function: "loadTenLatestLoginActivities"
});
});
$("#liveUpdateLoginActivities").click(liveActivityHandler);
function liveActivityHandler () {
$("#liveUpdateLoginActivities").text("Stop Live Update");
setInterval(function () {
$("#loginActivities").load("https://www.prodigy-official.de/resources/php/website_utilities.php", {
function: "loadTenLatestLoginActivities2"
});
}, 10000);
}
});
I have a Boostrap popover that will only show once and then will not work. What am I missing?
Here is my JS Fiddle
The Problem is due to $().load();, actually it's asynchronized and when you return $("#pop-content").load(...); for the first time it will return you the contents of #pop-content div, and thereafter contents of #pop-content set to the result of url you've mentioned in jQuery load, but in your case it's blank.
I've replaced $(#pop-content).load(...); with $(#pop-content).html(); and the results are as expected.
See Fiddle
EDIT
$(document).ready(function () {
$('.pop-form').popover({
html: true,
title: function () {
return $("#pop-head").html();
},
content: function () {
var result = '';
$.ajax({
url: "your url",
async: false,
success:function(response){
result = response;
}
});
return result;
}
});
// make popup larger
var p = $('.popbutton').popover();
p.on("show.bs.popover", function (e) {
p.data()["bs.popover"].$tip.css("max-width", "630px");
});
});
Try above code, it should work well.
I have added some javascript function in my partial page. But it is not firing. Need help.
Thanks in advance
#section scripts {
<script type="text/javascript">
$(document).ready(function () {
$('#btn').click(function (event) {
alert("Hi");
var filterstring = $('#txtCode').val();
$.get("/Test/Details?filterstring=" + $('#txtCode').val() + "", function (data) {
var getHTML = $(data);
$('#WebGrid').empty();
$('#WebGrid').html($('#WebGrid', getHTML));
ChkAddClass();
});
});
</script>
}
It is not possible to use sections in a partial view, you have to move this script to main view or use a custom helper.
And also since you are using AJAX you have to use delegated events to attach an event handler.
Please read the Direct and delegated events section of .on().
$(document).on('click', '#btn', function(){
alert("Hi");
var filterstring = $('#txtCode').val();
$.get("/Test/Details?filterstring=" + $('#txtCode').val() + "", function (data) {
var getHTML = $(data);
$('#WebGrid').empty();
$('#WebGrid').html($('#WebGrid', getHTML));
ChkAddClass();
});
});
Thanks!
You are closing you doc ready block after the closing script tag and you are missing );
<script type="text/javascript">
$(document).ready(function () {
$('#btn').click(function (event) {
alert("Hi");
var filterstring = $('#txtCode').val();
$.get("/Test/Details?filterstring=" + $('#txtCode').val() + "", function (data) {
var getHTML = $(data);
$('#WebGrid').empty();
$('#WebGrid').html($('#WebGrid', getHTML));
ChkAddClass();
});
});
});
</script>
I have a jQuery function that uses ajax to get data, then displays it, I want to use an if statement to determine if the function has already been run, if it has, a certain section of the function doesn't run again, for some reason, the if statement is being ignored.
This is my code:
<script type="text/javascript">
var a = 1;
$(function() {
if(a<2) {
$('.notifications').click(function() {
$('#notifications2').show();
$('#loader').show();
$.get('/getnotifications.php', function(data) {
$(".getnot").append(data);
$('#loader').hide();
a++;
});
});
}
});
</script>
Any idea why this is failing to work?
You're placing the if statement at the wrong point, try this:
<script type="text/javascript">
var a = 1;
$(function() {
$('.notifications').click(function() {
if(a<2) {
$('#notifications2').show();
$('#loader').show();
$.get('/getnotifications.php', function(data) {
$(".getnot").append(data);
$('#loader').hide();
a++;
});
}
});
});
</script>
You're current code is simply checking that a is less than 2 when the document first loads, not every time you click on .notifications.
<script type="text/javascript" charset="utf-8">
$(document).ready(function() {
$("a").click(function() {
$("#myDiv").load( "job_board_data.php", { pageNo: $(this).text()} );
return false;
});
});
</script>
1
How can I pass variables to my job_board_data.php script???? I want to pass variables such as page, sort by .. anyone?
$(document).ready(function() {
$("a").click(function() {
$("#myDiv").load("job_board_data.php", { pageNo: $(this).text()} );
return false;
});
});
In that code, when a user clicks on a link, you are loading the contents of the response for "job_board_data.php?pageNo=1" into a div.
job_board_data.php sees this as a regular HTML url call, so it would put the parameters (that you specified in the second parameter of $.load.
for example, using your above .load statement:
$_POST['pageNo']
will return
"1"
$('a').click(function () {
$('#myDiv').load($(this).attr('href'));
}