Here is my HTML:
<div ng-app="angularApp">
<div ng-controller="testCtrl">
testKey = {{testKey}}<br />
Test 1: <input type="text" ng-model="test.myKey" />{{test[testKey]}}<br />
Test 2: <input type="text" ng-model="test[testKey]" />{{test[testKey]}}
</div>
</div>
Here is the js:
angular.module('angularApp', []);
function testCtrl($scope)
{
$scope.testKey = "myKey";
}
I setup and example here
Why does Test 1 work but Test 2 not work? Are "[" not allowed in the ng-model directive?
Here a working example. The problem is very simple, test.[testKey] isn't valid, you want test[testKey]. And you need to define test as an object on the controller because you cannot set a property of an undefined variable.
Related
I have a form with id theForm which has the following div with a submit button inside:
<div id="placeOrder"
style="text-align: right; width: 100%; background-color: white;">
<button type="submit"
class='input_submit'
style="margin-right: 15px;"
onClick="placeOrder()">Place Order
</button>
</div>
When clicked, the function placeOrder() is called. The function changes the innerHTML of the above div to be "processing ..." (so the submit button is now gone).
The above code works, but now the problem is that I can't get the form to submit! I've tried putting this in the placeOrder() function:
document.theForm.submit();
But that doesn't work.
How can I get the form to submit?
Set the name attribute of your form to "theForm" and your code will work.
You can use...
document.getElementById('theForm').submit();
...but don't replace the innerHTML. You could hide the form and then insert a processing... span which will appear in its place.
var form = document.getElementById('theForm');
form.style.display = 'none';
var processing = document.createElement('span');
processing.appendChild(document.createTextNode('processing ...'));
form.parentNode.insertBefore(processing, form);
It works perfectly in my case.
document.getElementById("form1").submit();
Also, you can use it in a function as below:
function formSubmit()
{
document.getElementById("form1").submit();
}
document.forms["name of your form"].submit();
or
document.getElementById("form id").submit();
You can try any of this...this will definitely work...
I will leave the way I do to submit the form without using the name tag inside the form:
HTML
<button type="submit" onClick="placeOrder(this.form)">Place Order</button>
JavaScript
function placeOrder(form){
form.submit();
}
You can use the below code to submit the form using JavaScript:
document.getElementById('FormID').submit();
<html>
<body>
<p>Enter some text in the fields below, and then press the "Submit form" button to submit the form.</p>
<form id="myForm" action="/action_page.php">
First name: <input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br><br>
<input type="button" onclick="myFunction()" value="Submit form">
</form>
<script>
function myFunction() {
document.getElementById("myForm").submit();
}
</script>
</body>
</html>
HTML
<!-- change id attribute to name -->
<form method="post" action="yourUrl" name="theForm">
<button onclick="placeOrder()">Place Order</button>
</form>
JavaScript
function placeOrder () {
document.theForm.submit()
}
If your form does not have any id, but it has a class name like theForm, you can use the below statement to submit it:
document.getElementsByClassName("theForm")[0].submit();
I have came up with an easy resolve using a simple form hidden on my website with the same information the users logged in with. Example: If you want a user to be logged in on this form, you can add something like this to the follow form below.
<input type="checkbox" name="autologin" id="autologin" />
As far I know I am the first to hide a form and submit it via clicking a link. There is the link submitting a hidden form with the information. It is not 100% safe if you don't like auto login methods on your website with passwords sitting on a hidden form password text area...
Okay, so here is the work. Let’s say $siteid is the account and $sitepw is password.
First make the form in your PHP script. If you don’t like HTML in it, use minimal data and then echo in the value in a hidden form. I just use a PHP value and echo in anywhere I want pref next to the form button as you can't see it.
PHP form to print
$hidden_forum = '
<form id="alt_forum_login" action="./forum/ucp.php?mode=login" method="post" style="display:none;">
<input type="text" name="username" id="username" value="'.strtolower($siteid).'" title="Username" />
<input type="password" name="password" id="password" value="'.$sitepw.'" title="Password" />
</form>';
PHP and link to submit form
<?php print $hidden_forum; ?>
<pre>Forum</pre>
I am trying to change the "asp-action= ", unfortunately I could not find anything on the internet...
Currently I am working with a ViewBag where I can select a value from that list.
What I want is: I want to put that selected value from the ViewBag in the "asp-action= ( here ) "
Image of my index
Image of my Post method
<form method="post" enctype="multipart/form-data" asp-controller="Parser" asp-action= "PostDrone">
<div class="col-md-10">
<p>Upload one or more files using this form:</p>
<select asp-items="#(new SelectList(#ViewBag.listofitems ))"></select>
<input type="file" name="files" multiple />
</div>
</div>
<div class="form-group">
<div class="col-md-10">
<input type="submit" value="Upload" />
</div>
</div>
For example:
I want the "asp-action=" have the string value "PostSchoen" if I selected PostSchoen from the viewbag selectlist
I hope it is understandable what i said
What you wants to do it should doing by client side development with JS
But you have three ways:
1) You can change it by using JS
here an example with Jquery
need add it to onReady function this will change action to option val
<script>
$(function() {
$("select").change(function (){
//set form action to option val or get to whatever you need
$(this).closest("form").attr("action",$(this).val());
});
});
</script>
2) Send data to one contoller method then switch it by your select or other options
change in view
<select name="typeOfUploading" asp-items="#(new
SelectList(#ViewBag.listofitems ))"></select>
change in controller
PostDrone(List<IFromFile> files, string typeOfUploading)
{
//and use typeOfUploading this will be selected value from your select list
}
3) Firstly provide for user this data send choise, that generate him correct view with needed action
I need to replace the following helper with its corresponding HTML in a view:
#Html.HelperTextBoxFor(model => model.Length, new { #ng_change = "changeArea()" })
I came up with this:
<input type="text" data-ng-model="MyViewModel.Length" class="form-control" />
But I cannot find where to add the new { #ng_change = "changeArea()"}
Can anyone help me please?
If this #ng_change="..." is an Angular directive, this would look like this in an input tag:
<input type="text" data-ng-model="MyViewModel.Length" class="form-control" ng-change="changeArea()"/>
reference: https://docs.angularjs.org/api/ng/directive/ngChange
You need to get back to the basics here, not sure why you can't figure it out.
http://www.w3schools.com/jsref/event_onchange.asp
<input type="text" data-ng-model="MyViewModel.Length" class="form-control" onchange="changeArea();" />
I am working on an application using Classic ASP and SQL Server 2008 R2. We are using SSRS for the reports. Now the datasource changes depending on the user. I have been using a parameter for the connectionstring. It is working fine but the problem is the connectionstring shows in the URL. Is there a way to hide it? Or is there a better way.
Please Help.
Yes - change the method on your form to POST and use the Request.Form syntax instead of Request.QueryString:
<form id="myForm" method="post" action="myPage.asp">
<label for="txtBox">Type something</label>
<input type="text" id="txtBox" name="txtBox" />
</form>
<%
Dim value
value = Cstr(Request.Form("txtBox"))
If value <> "" then
'Do your processing
End if
%>
-- EDIT --
To be honest, though, I would not store my connection string on my form like this. You'd be far better off storing it in an Application level variable, like so:
Application("CON_STRING") = "...blahblahblah..."
This should be stored in the Application_OnStart event of the Global.asa* file.
*
Apologies for the link to w3schools - it was the best at the time!
-- EDIT 2 --
Try using an iframe to display the info...
<form id="frmRender" action="ABCD/ReportServer?/Reports/rptSalesReport.rpt"; method="post" target="_blank">
<input type="hidden" name="rs:Command" value="Render">
<input type="hidden" name="rc:LinkTarget" value="_blank">
<input type="hidden" name="rs:Format" value="HTML4.0">
<input type="hidden" name="rc:Parameters" value="False">
<input type="hidden" name="ConnectionString" value="<%=Session("ConnectionString")%>">
<input type="hidden" name="StartDate" value="<%=StartDate%>">
<input type="hidden" name="EndDate" value="<%=EndDate%>">
<a id="linkInfo" href="javascript:generateSsrs();">Generate Report</a>
<iframe id="ssrsReport" class="reportHeightWidth"></iframe>
</form >
<script language="javascript">
function genreateSsrs() {
document.getElementById("ssrsReport").src = "ABCD/ReportServer?/Reports/rptSalesReport.rpt?rs:Command=Render&rc:LinkTarget=top&rs:Format=HTML4.0&rc:Parameters=False&ConnectionString=<%=Server.URLEncode(Session("ConnectionString"))%>&StartDate=<%=StartDate%>&EndDate=<%=EndDate%>";
}
</script>
That's a rough version, but it's untested, so may need some tweaks.
In you code, use the below code
="Data Source="+Parameters!DatabaseServerName.Value+";Initial Catalog="&Parameters!DatabaseCatalogName.Value
I have a few "user settings" that I want to be based on a query I do on start-up. For instance, all my setting fields are checkbox inputs and I'll set them to yes or no based on the preference they chose previously that we have stored in the database.
My query from the client looks as follows:
Meteor.call('getNotificationPreferences', function(err, result) {
console.log(result);
Session.set('aNotificationPreference', result.a);
Session.set('bNotificationPreference', result.b);
Session.set('cNotificationPreference', result.c);
Session.set('dNotificationPreference', result.d);
});
This call simply pulls that information from MongoDB and sets the session variable correctly, but then I want to use that session variable to set the checkbox field "checked" attribute. I've tried to set this directly with jQuery and also reactively with Meteor. Sometimes this works and sometimes it doesn't.
The HTML looks something like this (using jquery mobile):
<template name="preferences">
<div data-role="collapsible" data-collapsed="false" data-collapsed-icon="mail" data-expanded-icon="edit">
<h2>Notifications</h2>
<div class="ui-field-contain">
<label for="aNotificationSwitch">A</label>
<input type="checkbox" data-role="flipswitch" data-theme="b" name="aNotificationSwitch" id="aNotificationSwitch" data-mini="true" checked={{aNotification}}>
</div>
<div class="ui-field-contain">
<label for="bNotificationSwitch">B</label>
<input type="checkbox" data-role="flipswitch" data-theme="b" name="bNotificationSwitch" id="bNotificationSwitch" data-mini="true" checked="{{bNotification}}">
</div>
<div class="ui-field-contain">
<label for="cNotificationSwitch">C</label>
<input type="checkbox" data-role="flipswitch" data-theme="b" name="cNotificationSwitch" id="cNotificationSwitch" data-mini="true" checked="{{cNotification}}">
</div>
<div class="ui-field-contain">
<label for="dNotificationSwitch">D</label>
<input type="checkbox" data-role="flipswitch" data-theme="b" name="dNotificationSwitch" id="dNotificationSwitch" data-mini="true" checked="{{dNotification}}">
</div>
</div>
</template>
Then in my JavaScript, I have the following:
Template.preferences.aNotification = function() {
// Setting directly doesn't work either
//$('#aNotificationSwitch').prop('checked', Session.get("aNotificationPreference"));
return Session.get("aNotificationPreference");
};
Can anyone explain why this wouldn't work consistently?
I've also tried doing this the Meteor way, by publishing the preferences as follows:
Meteor.publish("user-preferences", function () {
return Meteor.users.find({_id: this.userId},
{fields: {'notification': 1}});
});
The checked property of an HTML checkbox should not be set to either "true" or "false" as you're trying to do in your code, but respectively to "checked" and nothing.
<input type="checkbox" checked>
is the same as
<input type="checkbox" checked="checked">
These two examples will set the checkbox in the active (checked) state, although the first example is preferable because it's more concise.
An unchecked checkbox is achieved by not specifying the attribute at all :
<input type="checkbox">
So as far as Meteor is concerned, change your helper to :
Template.preferences.aNotification = function() {
return Session.get("aNotificationPreference")?"checked":"";
};
And in the HTML, just do :
<input type="checkbox" {{aNotification}}>
From a design perspective, I wouldn't store the user settings in Session variables fetched from the server via a method call, it doesn't sound very meteorish.
Have you considered storing these settings as properties in the Meteor.user() object ? This would involve setting these properties via a method call, and then publishing the properties explicitly to the client.
Server publication :
Meteor.publish("userSettings",function(){
if(!this.userId){
this.ready();
return;
}
return Meteor.users.find(this.userId,{
fields:{
"profile.settings":1
}
});
});
Client :
// this should be put in a iron:router RouteController waitOn !
Meteor.subscribe("userSettings");
Template.preferences.helpers({
aNotification:function(){
if(!Meteor.userId()){
return "";
}
// this will fail if the publication is not yet ready
// either guard accessing sub properties (this is bad)
// or use iron:router to wait on the subscription (this is good)
return Meteor.user().profile.settings.a?"checked":"";
}
});