When an option (e.g., banana) is selected from the autocomplete list populated by a datalist, the selected option (banana) is entered into the textbox as expected, but the autocomplete list is still displayed as shown in the attached image.
On the contrary, the list disappears as expected if the event is bound by phx-submit (rather than phx-change, phx-keyup or phx-keydown). Unfortunately, I can't use phx-submit because autocomplete list should be updated as the input is made.
It appears that when an option is selected, and LiveView finishes handling phx-change and updates the page, it re-activates the autocomplete menu. How can I avoid this and make the option list disappear when an option is selected?
<form phx-change="username_change2">
<input id="username2"
type="text"
name="username2"
placeholder="Enter your name"
autofocus
autocomplete="off"
list="usernames"
value ={#username}>
</form>
<datalist id="usernames">
<%= for username <- (["apple","banana","cherry", "peach"]) do %>
<option value= { username }><%= username %></option>
<% end %>
</datalist>
def handle_event("username_change2", %{"username2" => kwd}, socket) do
IO.inspect(kwd, label: "username changed2")
socket1 = assign(socket, username1: kwd, username: kwd)
{:noreply, socket1}
end
Related
I have to show a link(Products) in the header after user login to the application. It fail to display the link at first but if I refresh the page the link appears and it logout from the application. The problem is, initially the session variable(LoginID) were I'm using to check in the condition is null, after I refresh the page the appropriate value sets in the same. The three separate page are link in the header page, the form in login page and the codebehind in the Login.asp page. Please suggest me what I'm missing here.
header.asp
Dim qcVisible, LoginID
LoginID=Session("LoginID")
if Session("LoginID")="invaliduser" or Session("LoginID")="" Then
qcVisible = "none"
else
qcVisible = "block"
end if
<div class="menu">
<ul class="clearfix">
<li class="active">Home</li>
<li>Products</li>
<li>Contact</li>
</ul>
</div>
Mylogin.asp(Form)
<!--#include file="header.asp"-->
Session("LoginID")="validuser"
<form name="MyForm" method="post" action="Login.asp" id="loginform">
<fieldset>
<div class="field">
<input type="text" name="LoginID" placeholder="User ID" id="LoginID" />
</div>
<div class="field">
<input type="password" name="PWD" placeholder="Password" id="PWD" />
</div>
<div class="field">
<button class="field_bt" type="submit" form="loginform" name="submit1">Sign In</button>
</div>
</fieldset>
</form>
Login.asp
Login(Request.Form("LoginID"),Request.Form("PWD"))
Function Login(LoginID,Password)
Dim objRS,strSQL
Set objRS=Server.CreateObject ("ADODB.Recordset")
`strSQL = Query
objRS.Open strSQL,objconn
If not objRs.Eof and not objRS.Bof then
dim muser
muser = Mid(objRS("user_password"),1,3)
dim mpass
mpass = Mid(Password,1,3)
If trim(muser)= trim(mpass) Then
Login=True
Session("LoginID")=LoginID
Session("Password")=Password
Else
Login=False
End If
End If
objRS.Close
Exit Function
End Function
<div class="maincontent">
<object id="obj" data="Mylogin.asp" type="text/html"></object>
</div>
Before Login
After login and refresh the page, its logout and the link shows.
Any help would be appreciated. Thanks.
Edited
Based on the member suggestion I tried the following
'If Request.Form.Count > 0 Then(Another Way)
If Request.ServerVariables("REQUEST_METHOD") = "POST" Then
if Session("LoginID")="invaliduser" or Session("LoginID")="" Then
qcVisible = "none"
else
qcVisible = "block"
end if
End If
There are a couple things wrong with your approach:
Session("LoginID") should either have no value (logged out) or a value (logged in).
You are tasking the clientside of hiding the link which can be defeated by looking in the browser's DevTools or source code.
To solve these issues:
#1: Only set Session("LoginID") when a log in is successful.
#2: Your Product-check should look like this to only generate the HTML if the user is logged in (remeber that the session should ONLY have a value if logged in):
<% If Session("LoginID") <> "" Then %><li>Products</li><% End If %>
in your code you set the visible to none if the loginID is empty string when you first load the page what do you think it is??:
if Session("LoginID")="invaliduser" or Session("LoginID")="" Then
qcVisible = "none"
Then later on you go:
<li>Products</li>
it is equilvalent to going:
<li>Products</li>
Before you actually refresh the page or login....
Instead you might want to try:
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
//Do your styles in here
}else{
qcVisible = "block";
}
Usually when you load a webpage a GET request is sent, and if you refresh it or click submit the request you specified on your form will be sent in your case POST, so when the user did not enter anything you want to display product hence it will be in the else statement..... Otherwise you want to check if it is valid or not... :)
I'm working on a classic asp application ( I know, not by choice).
I have a button in my form that is supposed to do a Search based on criteria that user enters it.
To give a basic structure here's what it looks like:
<form action="IncidentMain.asp" method="post" name="frmAdd" onSubmit="return checkform( this )">
<input TYPE="image" SRC="Include/Search.gif" ALT="Search" VALUE="submit" id="IMAGE4" name="IMAGE2" onclick="javascript: document.frmAdd.txtaction.value = 'search';" >
</form>
Upon clicking on the button, as can be seen in the form action ="IncidentMain.asp", On submit I call a function, which actually gets called properly.
function checkform ( form )
{
if (form.txtIncidentNumber.value == "") {
alert( "Please Enter Incident Number" );
form.txtIncidentNumber.focus();
return false ;
}
alert("IM HERE");
return true ;
}
So it definitely gets through this function, then I have my last piece of code to actually do the search which is this:
<%
IF Request.Form("txtaction") = "search" THEN
'IT NEVER GETS HERE
'SeLECT DATA FROM SQL SERVER
End if
%>
I do not understand why it happens like that. IT basically looks like it does not want to communicate with the server, it stops short somewhere. Is there any reason why this code would not work?
EDIT:
<form method="post" action="Incident.asp" name="frmuser" onsubmit="return checkform( this )">
<input type="submit" value="Save / Submit" name="btnSubmit"
id="SaveButton" >
</form>
this code here doesn't hit the checkform(this) function but it gets to my VB code which starts like this:
<%
if Request.Form("btnSubmit") ="Save / Submit" THEN
The approach could be a lot simpler if you just want to check that a search has been submitted you could use;
Dim is_submit: is_submit = (Len(Request.Form & "") > 0)
If is_submit Then
'We have a POST form submission do something.
End If
or even;
Dim request_method: request_method = LCase(Request.ServerVariables("REQUEST_METHOD") & "")
If request_method = "post" Then
'We have a POST request (likely a form submission).
End If
Storing hidden input values just clutters the HTML and in a lot of cases is unnecessary, when you also have to update them using event handlers in the page you add an extra layer of unnecessary complexity.
However for any of this to work you have to have something to contain the search, the very simplest of forms should look something like;
<form action="IncidentMain.asp" method="post">
<input type="text" name="txtIncidentNumber" value="" />
<input type="image" name="IMAGE2" src="Include/Search.gif" alt="Search" value="submit" />
</form>
Add a hidden txtaction input field into the form.
The form is missing the hidden field "txtaction". Add the field and enter the value="search".
And remove the javascript that should have done that.
I am trying to use the helper collection_radio_buttons to show an image as a label, and want to save the image_id to the model so that I can retrieve the url, so far I have come up with this which shows a radio button and the image_url as the label.
Something I have noticed already is that I can only click the radio button once and it then just stays in its on state:
<%= f.collection_radio_buttons(:default_image_id, DefaultImage.all, :id, :image) %>
The html generated looks like so:
<input id="campaign_default_image_id_1" name="campaign[default_image_id]" type="radio" value="1" />
<label for="campaign_default_image_id_1">https://calcuttatest.s3.amazonaws.com/uploads/default_image/image/1/vandals_portfolio.png</label>
How do I set this up correctly? Can I wrap the label in a image_tag ?
Edit
So after some more research and trying to piece this together I can now render an image and a radio button, but the image is the default image I uploaded with carrierwave and not the resized :small version that I would like. Can I pass the :small version through?
<%= f.collection_radio_buttons(:default_image_id, DefaultImage.all, :id, :image) do |b| %>
<%= b.label { image_tag("#{b.text}") + b.radio_button } %>
b.text retrieves the url
https://calcuttatest.s3.amazonaws.com/uploads/default_image/image/2/ymca_portfolio.png
But I would like it to prefix the filename with fancy_box_array, like so:
https://calcuttatest.s3.amazonaws.com/uploads/default_image/image/2/fancy_box_array_ymca_portfolio.png
The html generated with this new code is:
<label for="campaign_default_image_id_1"><img alt="Vandals portfolio" src="https://calcuttatest.s3.amazonaws.com/uploads/default_image/image/1/vandals_portfolio.png" />
<input id="campaign_default_image_id_1" name="campaign[default_image_id]" type="radio" value="1" /></label>
thanks
There is a good reference on what you are trying to do. Try something like:
f.collection_radio_buttons(:default_image_id, DefaultImage.all, :id, :image) do |b|
b.label { b.radio_button + image_tag(b.object.image) }
end
I have viewmodel that i use for 'add' form. On that form i have 1 textbox called 'description'.
First time user enter some text in that field. Whan user press cancel( on the same form ) and then press Add again the form appearing with entered value in the 'description' field.
I want to create new view model and unbind all model with wrong value. But when i do that:
kendo.unbind($("#notes-dialog"));
kendo.bind($("#notes-dialog"), notesWindowModel);
the old value persist in the description textbox.
EDIT:
notesWindowModel = kendo.observable(
{
text: '2'
});
kendo.bind($("#notes-dialog"), notesWindowModel);
var notesWindowModel2 = kendo.observable(
{
text: '4'
});
kendo.unbind($("#notes-dialog"));
kendo.bind($("#notes-dialog"), notesWindowModel2);
Why does my field equal 2?
If i add
notesWindowModel.set('text', 'aaaa');
at the end my value equals 'aaaa'. It means that element is binded to first model. What is wrong here?
I found the problem:
<div id="notes-dialog">
<div id="notes-dialog-window" data-role="window" data-width="410" data-height="510" data-actions="" data-modal="true" data-title="false" style="display: none;">
<div id="notes-new-item">
<div>
<h3>Notes</h3>
<div>
<span>Note</span> <span>Is Delay?</span><span><input data-bind="value: model.Entity.IsDelay" class='k-input notes-checkbox' type='checkbox' /></span>
</div>
<div>
<textarea class="k-input utility-analysis-textarea notes-textarea" data-bind="value: text"></textarea>
The problem was that i have kendo window inside that element and when i open that window first time it replaces HTML and binding was wrong.
Old thread but I've recently faced the same issue.
In my case I've just had to destroy all kendo elements:
kendo.destroy(document.body);
I have tried a number of Ruby/Watir options to identify these two radio buttons and I can't do it. I want to .flash the radio button first then .set one of them.
browser.radio(:name => "appchoice_apps", :text => "Supervisor Console").flash
browser.radio(:span => "appchoice_supervisor").flash
I am not sure what else to try. I am very new here and I apologize for burning up your time.
<span id="appchoice_supervisor" style="visibility: visible;">
<input type="radio" name="appchoice_apps"></input>
Supervisor Console
</span>
<span id="appchoice_oa" style="display: block;">
<input type="radio" checked="" name="appchoice_apps"><input>
Associate Desktop
<br></br>
</span>
Solution 1 - By Text
The first example will not work because the text "Supervisor Console" is a sibling of the radio button rather than a text of the radio button.
browser.radio(:name => "appchoice_apps", :text => "Supervisor Console").flash
To check the sibling text, you can try getting the span by its text and then navigating to the radio button:
browser.span(:text => "Supervisor Console").radio.flash
Solution 2 - By Parent ID
The second example will not work because span is not a valid identifier.
browser.radio(:span => "appchoice_supervisor").flash
Like the first solution, you can locate the span by its id and then look for a radio button within that span:
browser.span(:id => "appchoice_supervisor").radio.flash