Go Premium for a chance to win a PS4. Enter to Win

x

JavaScript

120K

Solutions

41K

Contributors

JavaScript is a dynamic, object-based language commonly used for client-side scripting in web browsers. Recently, server side JavaScript frameworks have also emerged. JavaScript runs on nearly every operating system and  in almost every mainstream web browser.

Share tech news, updates, or what's on your mind.

Sign up to Post

Hi All,

I am trying to do some things with JSON that I have coded in jsfiddle.  When "PROJ123" is entered into the "Project Number" field, the "Plan Number" drop down box gets populated with corresponding values.  When it gets populated though, I want the default value to be blank.  How do I do that?

Also, I want the corresponding contract type to populate <span id="contractType"></span> based on the "Plan Number" selected.
Here's how to get the contract type Contracts[x].Plan.Info.ContractType from JSON.

<table border="1" width="65%" style="background-color:#eeeeee">
  <tr style="background-color:#00558D;color:white;font-weight:bold;font-size:14px">
    <td colspan="4">New Contract</td>
  </tr>

  <tr>
  	<td>Project Number</td>
  	<td colspan="3"><input type="text" value="" id="projectNumber"></td>
  </tr>

  <tr>
  	<td>Plan Number</td>
  	<td colspan="3">
  		<select id="planNumber">
  			<option value=""></option>
  		</select><span id="contractType"></span>
  	</td>
  </tr>

Open in new window



function getPlanNumbers(projNumber){
$("#planNumber").empty();

var planNumber = [];
var y=0;
var pNumOption = document.getElementById("planNumber");

for (var x=0; x<jsonFile.Result.Contracts.length; x++){
//alert(jsonFile.Result.Contracts[x].Plan.Info.ProjectNumber);
if (jsonFile.Result.Contracts[x].Plan.Info.ProjectNumber === projNumber){
planNumber.push(jsonFile.Result.Contracts[x].Plan.Identification.PlanNumber);
}else{
y++;
}
}
if (jsonFile.Result.Contracts.length == y){
alert("Project Number '"+ projNumber + "' does not exist.");
}else{
for(var i=0; i<planNumber.length; i++){
var option = document.createElement('option');
                                
option.value = planNumber[i];
option.innerHTML = planNumber[i];
                                   
pNumOption.appendChild(option);
}

}

// alert("populate dropdown");
}

Open in new window


The actual JSON can be found at this jsfiddle with the rest of the code.
https://jsfiddle.net/isogunro/03y6zwbe/
0
Dear,
I want to put attached picture file, as the background of this Web page.
http://my-friend.co/HouseList4/Default.aspx?userid=mc23

How?
beautiful-house.jpg
0
This makes no sense to me. I created CanvasComponent correctly, I think. I did it manually since the automtation failed me on another questionI posted,

c:\Dev\pp\src\app\app.module.ts
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppComponent } from './app.component';
import { CanvasComponent } from './components/canvas/canvas.component';

@NgModule({
  declarations: [
    AppComponent,
    CanvasComponent    
  ],
  imports: [
    BrowserModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

Open in new window


c:\Dev\pp\src\app\components\canvas\canvas.component.html
<h1>Hello from the Canvas1</h1>

Open in new window


c:\Dev\pp\src\app\app.component.html
<p>Hello from App</p>
<canvas></canvas>

Open in new window


c:\Dev\pp\src\app\components\canvas\canvas.component.ts
import { Component } from '@angular/core';

@Component({
  selector: 'canvas',
  //templateUrl: './canvas.component.html',
  template: `<h1>Hello from the Canvas2<h1>`
})

export class CanvasComponent {
  title = 'Title';
}

Open in new window



All I get is "Hello from App"

Chrome
Why don't I see?

Hello from the Canvas2

You can see I have commented out:
  //templateUrl: './canvas.component.html',

since that failed also.

Thanks for any help you can provide.

New news...

canvas does show in the debugger...


More new news...

When I place a <br> before <canvas></canvas>
the canvas does not show up on the pages. The same thing happens when I remove:

<p>Hello from the App</>


Lastly, I do see the message in the debugger...

canvas appears on the pageScreen-Shot-2017-10-09-at-11.25.16-P.png
0
I THINK I have a good installation of Node and Angular 4...here's why:

PS C:\dev\pp\src\app\components> ng -v
    _                      _                 ____ _     ___
   / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
  / ? \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
 / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
/_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
               |___/
@angular/cli: 1.4.5
node: 8.6.0
os: win32 x64
@angular/animations: 4.4.4
@angular/common: 4.4.4
@angular/compiler: 4.4.4
@angular/core: 4.4.4
@angular/forms: 4.4.4
@angular/http: 4.4.4
@angular/platform-browser: 4.4.4
@angular/platform-browser-dynamic: 4.4.4
@angular/router: 4.4.4
@angular/cli: 1.4.5
@angular/compiler-cli: 4.4.4
@angular/language-service: 4.4.4
typescript: 2.3.4
PS C:\dev\pp\src\app\components>

but I can not generate a new component.

PS C:\dev\pp\src\app\components> ng g component [canvas]
The command "generate" has an option without the required type and name fields.
Error: The command "generate" has an option without the required type and name fields.
    at Class.validateOption (C:\dev\pp\node_modules\@angular\cli\ember-cli\lib\models\command.js:377:13)
    at Array.map (<anonymous>)
    at Class.registerOptions (C:\dev\pp\node_modules\@angular\cli\ember-cli\lib\models\command.js:163:27)
    at getOptionsTask.run.then (C:\dev\pp\node_modules\@angular\cli\commands\generate.js:98:18)
    at …
0
Hello There

i am a VB.net programmer by trade.  But now I am  coding some javascript and am having a bit of trouble.  I am calling a function to get data from a mySql database and then formatting for display in the console.  Then under that, I want to put
a User entry prompt.  The problem is the User entry line is displaying first then the data.  

How can I get the mySql data to print to the console first and when done prompt the User for input? It "feels" like the sql statement is finishing after the prompt is displayed. So I need to make sure it finishes first.

Any ideas?

Thanks,
jimbo99999
0
I am trying to find the styles for a payment buttin at stripe.com

Tried the instructions at the stripe.com documentation section

Step 3: Create and mount the paymentRequestButton Element doesn't seem to ever work?
0
I plan a simple Angular website with little user data needing to be persisted, at first. Username, Email, personal preferences, etc.

What of the value of using Firebase versus me configuring a MySQL database? Clearly, there seems to be no back-end service needing to be written, and that is pretty awesome.

Is this NoSQL?

What other advantages are there? What other free alternatives are there?

Thanks
0
I need html to mimic a loading page.

There are many examples... I chose the paypal example

This will be on a .Net web page and runs while my back end code decrypts the URL Query String http://myurl.com?enc=kydol

PPSecure
0
When I have the Angular server running, but I'd like to terminate it, must I select Ctr+X?

ng serve
Is this the right way to shut it down? I do not have a command prompt when using PowerShel on Windows

Thanks
0
I see Typescript can define statically types variable with the word "let"

how do these two lines differ?

let name: string = 'Bob';

name: string = 'Bob';
0
This is my hello.js file:

console.log(“Angular works on the Mac”);

I installed Angular, but an trying to verify it works. What's wrong here?

$ node hello.js
/Users/newbieweb/Desktop/Dev/Angular/udemy-dream-app/hello.js:1
(function (exports, require, module, __filename, __dirname) { console.log(“Angular works on the Mac”);
                                                                          ^

SyntaxError: Invalid or unexpected token
    at createScript (vm.js:80:10)
    at Object.runInThisContext (vm.js:139:10)
    at Module._compile (module.js:588:28)
    at Object.Module._extensions..js (module.js:635:10)
    at Module.load (module.js:545:32)
    at tryModuleLoad (module.js:508:12)
    at Function.Module._load (module.js:500:3)
    at Function.Module.runMain (module.js:665:10)
    at startup (bootstrap_node.js:187:16)
    at bootstrap_node.js:607:3
0
Hi there,

So in my project I have a *ngFor loop and then in the child element I have a *ngSwitchCase that will produce an error.

The error says: 'Can't bind to '*ngSwitchCase' since it isn't a known property of 'div'.'

Here are screenshots:
Error Screenshot
Error ScreenshotText Editor Screenshot
Text Editor Screenshot
0
Where can I get gulp.js?
0
After running the following:

$sudo n stable

I got this version response for Node:

$ node -v
v8.6.0

I then ran:

$npm install -g @angular/cli

but got permission errors which suggested I run the command  as root.
 
So, I tried:

$sudo su
(added my password)

$npm install -g @angular/cli
but get bad sounding warnings...


Node warnings
I killed the process, but need to get Angular installed. What can I do?

I get the following error when I try and start the server, whether I am root or have exited root:

sh-3.2# ng serve
module.js:529
    throw err;
    ^

Error: Cannot find module '@ngtools/json-schema'
    at Function.Module._resolveFilename (module.js:527:15)
    at Function.Module._load (module.js:476:23)
    at Module.require (module.js:568:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (/usr/local/lib/node_modules/@angular/cli/models/config/config.js:7:23)
    at Module._compile (module.js:624:30)
    at Object.Module._extensions..js (module.js:635:10)
    at Module.load (module.js:545:32)
    at tryModuleLoad (module.js:508:12)
    at Function.Module._load (module.js:500:3)

Is this an Old version of Node??
0
Anybody know why the onchange() isn't working?  This is the error I get
Uncaught ReferenceError: getProj is not defined
    at HTMLSelectElement.onchange


http://jsfiddle.net/isogunro/r6e4gm34/

<select id="contracts" onchange="getProj(this)">
  <option value=""></option>
</select>
<span id="ctType"></span>


function getProj(sel) {
var ct = document.getElementById("ctType");
ct.innerHTML = contractAry[2].contractType;
	alert(sel.value);
  
}

Open in new window

0
Dear,
It would further go to another URL previously, when I click record below
18a.pngto this URL.
http://my-friend.co/HouseList4/Default.aspx?userid=mc23

But now it does not, and why?
0
Expert,

I am worried about line 7 (MARKED:     // THE FOLLOWING LINE IS WORRYSOME...)  as I found this parameter in the debugger.  This works (at least on Chrome) but I could not find any documentation using  "sender._element.id" .  Whenever I did stuff that was not documented, it came back to haunt me.  

What is the proper or best practice to get the "element id" from "sender"?

Kind Regards
Sam

js code:
//
//<ajaxtoolkit:TabPanel ID="tpTabPanel" ... <do not runat=server>
//              OnClientClick="setIframeSrc" data-iframeId="the-id-of-the-iframe" data-srcUrl="Site/webform.aspx">
//
function setIframeSrc(sender, args) {

    // THE FOLLOWING LINE IS WORRYSOME...
    var iframeId = document.getElementById(sender._element.id).getAttribute('data-iframeId'); 

    var oiframe = document.getElementById(iframeId);
    var srcUrl = document.getElementById(sender._element.id).getAttribute('data-srcUrl');
    
    //if (iframeId.IsLoaded == undefined) It is the first time, so load Iframe which will initialize the IsLoaded parameter so it dosen't happen again
    if (oiframe.IsLoaded == undefined) {
        oiframe.src = srcUrl;
        oiframe.IsLoaded = 'true'; //create and set custom attribute
        //alert("oiframe.IsLoaded set -->" + oiframe.IsLoaded + "<--");
    }
    else {
        //alert("oiframe.IsLoaded is defined "); //do nothing...
    }
}

Open in new window

0
I get the following version:

sh-3.2# node -v
v0.10.26
sh-3.2#

And what steps do I follow to check if it was installed with Homebrew?


Ans lastly, how do I update to latest version?

Thanks
0
Hi,

I have a tab menu that I need to navigate.  

I'm not sure how to do this.

Please help me with the below code.

<script>
    $(document).ready(function () {
        $("nav").find("li").on("click", "a", function () {
            $('.navbar-collapse.in').collapse('hide');
        });
    });
</script>

 <ul class="nav nav-tabs nav-tab-default" role="tablist">
                    <li class="active"><a href="#Tab1" data-toggle="Tab1" style="color:White";>Tab1</a></li>
                    <li><a href="#Tab2" data-toggle="tab">Tab2</a></li> 
                    <li><a href="#Tab3" data-toggle="tab">Tab3</a></li>
                    <li><a href="#Tab4" data-toggle="tab">Tab4</a></li>
       </ul>

             <div role="tabpanel" class="tab-pane active" id="Tab1">
                        <ul class="col-md-12">
                           <li> 111111 </li>
                       </ul>
               </div>

              <div role="tabpanel" class="tab-pane" id="Tab2">
                        <ul class="col-md-12">
                        <li> 2222222 </li>
                       </ul>
               </div>

              <div role="tabpanel" class="tab-pane" id="Tab3">
                        <ul class="col-md-12">
                        <li> 333333 </li>
                       </ul>
               </div>

              <div role="tabpanel" class="tab-pane" id="Tab4">
                        <ul class="col-md-12">
                        <li> 44444 </li>
    

Open in new window

0
1. I have a form with jquery jqgrid.  
2. When grid row is selected, a panel is loaded via ajax that has button.
3. When the button in panel is clicked, javascript function is called to load an Edit view into a modal div.
4. When the modal form is dismissed, using the data-dismiss="modal", on button button click, the modal form closes but the main form's javascript no longer functions.

don't what to look for here.  any guidance appreciated.
0
//I have to reverse the input and eliminate the nums and chars that are not in alphabet. 

function reverseLetter(str) {
  var alphabet = ['a', 'b', 'c','d', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o','p','q','r','s','t','u','v','w','x','y','z'];
  var input = str;
  var output = '';

  for(var i = input.length-1; i >= 0; i--){
    if(alphabet.indexOf(input[i])){
      output+= input[i];
    }
  }
  return output;
}

// console.log(reverseLetter('nahsirk'));  // expected: 'krishan' actual: 'krishn'   >>> 'a' is missing
console.log(reverseLetter('ultr53o?n'));   //this was supposed to eliminate numbers and non-alphabetic characters, but it didn't

Open in new window

0
Dear,
How to remove highlighted extra line below?
17z.png
to URL below
http://my-friend.co/Test_rec4/Default.aspx?userid=mc23
0
I had this question after reviewing Conditional Validation of fields.

In the first and original question I've got an answer from Leonidas Dosas which does not completely solve my problem. His answer makes the gender and age fields required when the name field has a value. But I need all fields to work this way. So if one of the three fields contain a value the other ones should be required too.
And if this should results in the removal of the value by the user because it has accidentally got a  value it should result back into no required fields at all for that (second or third kid) line.

I've tried the achieve it like this:

 
  <!doctype html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.js"></script>
    </head>
    <body>
         <center>
<form method="post" name="test" action="data_handler.php">
<table>
	<tr>
		<td><label for='text'>Your number :</label></td>
		<td><input type='number' name='PNR'  id='PNR' autofocus required><font color='red'>*</font></td>
	</tr>
	<tr>
		<td><label for="text">E-mail :</label></td>
		<td><input type="email" name="email" id="email" required><font color="red">*</font></td>
	</tr>
	<tr>
		<td colspan=2><label for="text">Kids (max.3):</label></td>
	</tr>
	<tr>
		<td></td>
		<td>
			<table border=0>
				<tr>

Open in new window

0
I have a document library and I would like to update the metadata(columns) of a document using JSOM.  I thought the following would work but it works just on custom library.

 var ctx = new SP.ClientContext.get_current();
                            var customList = ctx.get_web().get_lists().getByTitle('Shared Documents');
                            var listItem = customList.getItemById(itemID);

                            /*Set the value and update*/
                            listItem.set_item('Project_0020_Number', prjNum);
                            listItem.update();

                            ctx.executeQueryAsync(
                            function(){ 
                                                                            /*Need to change this to show on the page*/
                                                                            alert('Updated'); 
                                            }, 

                                            function(sender, args){ alert('Error: ' + args.get_message()); });
                                            }

                                            function onQueryFailed(sender, args) {
                                                            alert('Request failed. '+args.get_message() + '\n' + args.get_stackTrace());

Open in new window

0
Hi there. On my page here, https://secure2.convio.net/cfnc/site/Donation2;jsessionid=00000000.app20103a?df_id=1591&mfc_pref=T&1591.donation=form1&NONCE_TOKEN=3A269D0332B90C212969D9595AE680CB I want to pre-check the checkbox called level_standardauto_repeatname but want to do it using either css or js and cannot do it from within the form (a restriction within Luminate). I've tried this but it's not working...

<script type="text/javascript">
document.getElementById("level_standardauto_repeatname").checked = true;
</script> 

Open in new window


Any ideas experts?
0

JavaScript

120K

Solutions

41K

Contributors

JavaScript is a dynamic, object-based language commonly used for client-side scripting in web browsers. Recently, server side JavaScript frameworks have also emerged. JavaScript runs on nearly every operating system and  in almost every mainstream web browser.