|
|
|
|
$(table).append(html);
Everyone is born right handed. Only the strongest overcome it.
Fight for left-handed rights and hand equality.
|
|
|
|
|
I'm seemed to be confused here with on and off. With Setting the event and then turning them off during an $.Ajax function
In my $(document).ready, I do the bind, or On. I was using .click
$(document).on("change", "#Shipper_VendorID", function () {
load_rateAPICodes();
});
$(document).on("change", "#Shipper_RateAPICode", function () {
load_RateAPIDetails();
});
When I had declared the function here, the function was firing during unload so I removed the function
beforeSend: function () {
$(document).off("change", $ddl_vendorID);
$(document).off("change", $ddl_serviceID);
},
Here I rebind the function, but it fires the function I'm trying to bind.
complete: function () {
$(document).on("change", $ddl_vendorID, load_rateAPICodes());
$(document).on("change", $ddl_serviceID, load_RateAPIDetails());
}
I guess I don't understand why on and off fires the function when I just want to ignore the bind.
This is the whole function in case your wondering what I'm doing here.
You click on a radio button item in a group and I fetch the vendor and service, and then run another $.Ajax to get the service maximum parameters.
But if the vendor is different, I have to reload the services that match that vendor, and then select the service which isn't working well for me.
I just too much going on here.
function run_packageSelect(_packageID) {
var $txt_orderID = $("#Order_ID"),<br />
$ddl_vendorID = $("#Shipper_VendorID"),
$ddl_serviceID = $("#Shipper_RateAPICode"),
$js_packageAdd = $("#js_packageAdd"),
_dataVendorID = $("#Shipper_VendorID option:selected").attr("value"),
_dataVendorAttr = $ddl_serviceID.attr("data-vendor");
$js_packageAdd.collapse('hide');
$.ajax({
type: "POST",
cache: true,
dataType: "json",
global: true,
url: '/Ajax/Json_Shipment_Order_Package_Fetch',
data: { Package_ID: parseInt(_packageID, 10) },
beforeSend: function () {
$(document).off("change", $ddl_vendorID);
$(document).off("change", $ddl_serviceID);<br />
},
error: function (response) {<br />
alert("http code: " + response.status + " Error: Json_Shipment_Order_Package_Fetch - data: " + response);
},
success: function (data) {
$ddl_vendorID.val(data.Vendor_ID);
if (parseInt(_dataVendorID, 10) !== parseInt(_dataVendorAttr, 10)) {
$.ajax({
type: "POST",
cache: true,
dataType: "json",
url: '/Ajax/Json_Shipment_Load_Vendor_Services',
global: true,
data: { ShipperID: parseInt(data.Vendor_ID, 10) },
error: function (response) {
alert("http code: " + response.status + " Error: Json_Order_Shipment_Load_Services - data: " + response);
},
success: function (data) {
var markup = "<option value=''> " + data.length + " services(s) found --</option>";
for (var x = 0; x < data.length; x++) {
if (data.Value == data.Service_ID) {
markup += "<option value=" + data[x].Value + " selected>" + data[x].Text + "</option>";
}
else {
markup += "<option value=" + data[x].Value + ">" + data[x].Text + "</option>";
}
}
$("#Shipper_RateAPICode").html(markup).show();
},
complete: function () {
$ddl_serviceID.val(data.Service_ID).change();
}
});
}
else {
$ddl_serviceID.val(data.Service_ID).change();
}
},
complete: function () {
$(document).on("change", $ddl_vendorID, load_rateAPICodes());
$(document).on("change", $ddl_serviceID, load_RateAPIDetails());<br />
}
});
}
If it ain't broke don't fix it
|
|
|
|
|
Maybe something to do with the nested AJAX call? The outer complete will fire whilst the inner call is still in-flight, so the events will have been re-attached by the time the inner complete is called.
"These people looked deep within my soul and assigned me a number based on the order in which I joined."
- Homer
|
|
|
|
|
I found out many events where in flight while the primary event occurred.
Then my code went crazy and started affecting others like Jquery.validation.
Learned you can't call $(document).on outside the document because it's read only. Everything there is read only.
I ended up writing a $.Ajax callback event handler in the $(document) ajaxComplete to bind and unbind events.
So I removed all the on and off from within the function and moved them to the event handlers.
Then dumped jquery validation and I'm writing manual ones now, because I'm using Razor with TextBox and not TextBoxFor.
Then there are rules, you can call .click or .change in the $(document) and turn them off with .off but to rebind .on really didn't work and had to use .click or .change again.
Lots of debugging in IE10 or 11, whatever I have loaded.
Thanks Richard for at least something. And I need to get back to that join you posted and learn how to adjust my table model in the DAL to use that method.
Just haven't made time to do that yet but it's coming.
If it ain't broke don't fix it
|
|
|
|
|
I have a WSDL file and would like to import it to a NodeJS server application . Is it possible to do so same as in C# were all the functions are automaticlly created?
I would thank anyone who can teach me the best way to work with NodeJS and soap web services.
Have a great day ,
|
|
|
|
|
I'm having a strange problem with ejs template engine in a nodejs, express app, that it's ignoring the if statement and showing the html inside if a css class is added to the html element. Here's the ejs code below:
This work and the if statement is effective:
<% if (typeof success !== "undefined") { %>
<h4><%= success %></h4>
<% } %>
This however show up on the page regardless:
<% if (typeof success !== "undefined") { %>
<div class="alert alert-success"><%= success %></div>
<% } %>
I'll include the app.js code as well below if needed :
const express = require('express');
const path = require('path');
const favicon = require('serve-favicon');
const logger = require('morgan');
const cookieParser = require('cookie-parser');
const session = require('express-session');
const bodyParser = require('body-parser');
const port = 5000;
const mongoose = require('mongoose');
const passport = require('passport');
const LocalStrategy = require('passport-local').Strategy;
const flash = require('connect-flash');
const engine = require('ejs-mate');
const app = express();
app.use(logger('dev'));
app.use(bodyParser.json() );
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.engine('ejs', engine);
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');
app.use(express.static(path.join(__dirname, 'public')));
app.use(session({
secret: 'keyboard cat',
resave: false,
saveUninitialized: true
}));
app.use(flash());
app.use(function(req, res, next) {
res.locals.currentUser = req.user;
res.locals.error = req.flash("error");
res.locals.success = req.flash("success");
next();
});
const indexes = require('./routes/indexes');
const diaries = require('./routes/diaries');
const users = require('./routes/users');
app.use(passport.initialize());
app.use(passport.session());
const db = require('./models');
passport.use(new LocalStrategy(db.User.authenticate()));
passport.serializeUser(db.User.serializeUser());
passport.deserializeUser(db.User.deserializeUser());
app.use('/users', users);
app.use('/', indexes);
app.use('/diaries', diaries);
app.use(function(req, res, next) {
var err = new Error('Not Found');
err.status = 404;
next(err);
});
app.use(function(err, req, res, next) {
res.locals.message = err.message;
res.locals.error = req.app.get('env') === 'development' ? err : {};
res.status(err.status || 500);
res.render('error');
});
app.listen(port, ()=>{
console.log(`App started on port ${port}`);
});
module.exports = app;
I've been going around in circles for awhile, so any help would be highly appreciated.
|
|
|
|
|
Based on drowdown value i would like to attach/detach bootstrap datepicker with textbox. i tried below way but it is not working as i want.....what i am missing there?
the problem is when jsfiddle run then calender is showing. i want datepicker will be shown when i select date from dropdown.
Attach textbox to datepicker with glyph icon - JSFiddle[^]
<div class="container">
<div class="row">
<div class='col-sm-2'>
<div class="form-group col-xs-5 col-lg-1">
<select id="dddata">
<option value="Text">Text</option>
<option value="Date">Date</option>
</select>
<div class='input-group date' id='datetimepicker1'>
<input type='text' class="form-control" />
</div>
</div>
</div>
</div>
</div>
$(document).ready(function ()
{
var $htmlelement = jQuery('<span class="glyphicon glyphicon-calendar"></span>');
SetUPUI();
$("#dddata").change(function() {
SetUPUI();
});
function SetUPUI() {
if ($('#dddata').val() == "Date") {
$('#datetimepicker1').append($htmlelement);
$('#datetimepicker1').datepicker({
autoclose: true,
format: "mm/dd/yyyy"
});
} else {
$('#datetimepicker1 span.input-group-addon').remove();
$('#datetimepicker1').datepicker("option", "disabled", true);
}
}
});
please help me to find out and fix this problem. thanks
|
|
|
|
|
|
here is my jquery code which is not working but i could not find out the area where problem lies.
please tell me what to fix in code
function setBG() {
$("#gridId").find("tr").each(function () {
var css = $(this).attr("class");
if (css != null && css == "bgRow")
$(this).addClass("norRow").removeClass("bgRow");
else if (css != null && css == "norRow")
$(this).addClass("bgRow").removeClass("norRow");
});
setTimeout("setBG()", 1000);
}
jsfiddle <a href="http://jsfiddle.net/tridip/mc2fb8ag/1/">highlight table row with css - JSFiddle</a>[<a href="http://jsfiddle.net/tridip/mc2fb8ag/1/" target="_blank" title="New Window">^</a>]
setBG();
|
|
|
|
|
|
sir thanks a lot for answer. how can i have smooth effect for flashing table row with color.
please check this link highlight table row with css - JSFiddle[^]
they use css but i do not want to use css rather i want the same effect with jquery....is it possible ?
i am weak in below css and that is the reason i want to achieve the same with jquery animate function.
body {
padding:25px;
}
@-webkit-keyframes blink {
50% {
background: rgba(255, 0, 0, 0.5);
}
}
@-moz-keyframes blink {
50% {
background: rgba(255, 0, 0, 0.5);
}
}
@keyframes blink {
50% {
background: rgba(255, 0, 0, 0.5);
}
}
.blink {
-webkit-animation-direction: normal;
-webkit-animation-duration: 5s;
-webkit-animation-iteration-count: infinite;
-webkit-animation-name: blink;
-webkit-animation-timing-function: linear;
-moz-animation-direction: normal;
-moz-animation-duration: 5s;
-moz-animation-iteration-count: infinite;
-moz-animation-name: blink;
-moz-animation-timing-function: linear;
animation-direction: normal;
animation-duration: 5s;
animation-iteration-count: infinite;
animation-name: blink;
animation-timing-function: linear;
}
table {
width: 100%;
}
table tr:nth-child(odd) {
background: gray;
}
sir can you please guide how can i do the smooth flashing effect with jquery. thanks
|
|
|
|
|
Simple: use CSS.
Animating via Javascript or jQuery will never be completely smooth, because it's not hardware accelerated.
You can probably drop the vendor prefixes - support for the unprefixed versions is fairly universal[^]:
body {
padding:25px;
}
@keyframes blink {
50% {
background: rgba(255, 0, 0, 0.5);
}
}
.blink {
animation-direction: normal;
animation-duration: 5s;
animation-iteration-count: infinite;
animation-name: blink;
animation-timing-function: linear;
}
table {
width: 100%;
}
table tr:nth-child(odd) {
background: gray;
}
If you really need to support older browsers which require prefixes, write the CSS using the un-prefixed versions, and then use a tool like Autoprefixer[^] to add the prefixed versions for you.
"These people looked deep within my soul and assigned me a number based on the order in which I joined."
- Homer
|
|
|
|
|
Thanks for your reply sir, i have basic knowledge over css. so i do not understand your below css code
@keyframes blink {
50% {
background: rgba(255, 0, 0, 0.5);
}
}
.blink {
animation-direction: normal;
animation-duration: 5s;
animation-iteration-count: infinite;
animation-name: blink;
animation-timing-function: linear;
}
if you please kindly explain two above css. thanks
|
|
|
|
|
|
thanks for your link. i do not work with css. tell me those css is css3?
you said - Animating via Javascript or jQuery will never be completely smooth, because it's not hardware accelerated.
what do you mean by hardware accelerated.
thanks
|
|
|
|
|
Google[^]
"These people looked deep within my soul and assigned me a number based on the order in which I joined."
- Homer
|
|
|
|
|
I am a novice to JavaScript and am trying to learn it out. I am struck with the automatic calculation of days and automatic insertion of month, calendar week based on the user entered data.
I searched and I got to calculate the differences only by static not by the user entered dates. Can anyone help me out here please.
I have 6 Text boxes.
In 1st textbox "Year" user enters a specific date (dd.mm.yy)
2nd text box needs to be automatically filled with the respective calendar week
3rd text box needs to be automatically filled with the respective month (Jan, Feb, Mar)
4th text box needs to be automatically filled with the respective year
5th text box user enters another date (dd.mm.yy)
6th text box needs to be automatically filled with the number of days difference between 2nd entered date and first entered date.
My code is as below.
>
$(function() {
$( "#datepicker").datepicker({ dateFormat: 'dd.mm.yy' });
$("#datepickerend").datepicker({ dateFormat: 'dd.mm.yy'});
});
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<div>
<table border="0">
<tr>
<td>Date: <input type=text name="date" id="datepicker"></td>
</tr>
<tr>
<td>CW: <input type=text name="CW"></td>
</tr>
<tr>
<td>Month: <input type=text name="Month"></td>
</tr>
<tr>
<td>Year: <input type=text name="Year"></td>
</tr>
<tr>
<td>Ending Date: <input type=text name="enddate" id="datepickerend"></td>
</tr>
<tr>
<td>Days: <input type=text name="days"></td>
</tr>
</table>
</div>
|
|
|
|
|
use the change event of the date picker boxes to do the actual work and update the other boxes
$(function () {
$("#datepicker").datepicker({ dateFormat: 'dd.mm.yy' });
$("#datepickerend").datepicker({ dateFormat: 'dd.mm.yy' });
$("#datepicker").change(function () {
var d = $("#datepicker").val();
var cw = $("input[name='CW']");
cw.val('CW value goes here');
});
$("#datepickerend").change(function () {
var d = $("#datepickerend").val();
});
});
If you need help parsing the date picker values to actual dates then consult the datepicker documentation as that shows how to do that.
|
|
|
|
|
I am trying to implement an embedded code for an Audit tool. This code by itself has a url box, email, phone, and submit. When someone clicks on submit it shows them the errors associated with their website (seo)
Here are the changes I want:
1. I want only the URL box. NO Email Box.
2. When user clicks on "submit", he would be shown a custom contact page
<pre lang="text">:
<!--RoboAuditor embed code start--><center><div id="roboaudit"></div></center><script id="growthrobo" src="https://245.growthrobotics.com/assets/site/js/sitecheck.js" data-content="245"></script><!--RoboAuditor embed code end-->
modified 27-Jan-18 0:47am.
|
|
|
|
|
|
I need to open a java screept inandroid phone
|
|
|
|
|
Do you want to say enabling java script in android phone.If not why do you want to open java script in android phone
|
|
|
|
|