Using file type, and accept attribute,, is there any way to restrict input method to camera only and avoid uploading from library.
The capture attribute of input tag does the magic here.
<input type="file" accept="image/*" capture />
Reference:
HTML Media Capture Examples
input camera file capture html mediadevices enumeratedevices
Related
i am using
<input *ngIf="selectedFile == ''" type="file" accept="image/*" capture="environment" (change)="onFileSelected($event)">
this renders a choose file control. which hitting opens the camera and picks the file. I am trying to completely avoid this manual choose file.
what would be the way to do it?
currently i have a mechanism to pass url parameter like ?action=scan . Using activatedRouter i am reading this param and render the above input control. I just want to launch camera rather.
If you just want to launch the camera directly, you have to use device element/user media with user permission and you can't use input element for the same. Check on this documentation and this one. Both have sample codes.
Update: Here is an Angular example.
I want to use Lightbox. Images are binding from back-end in VB.NET(database-sqlserver).
Here is HTML which is inside a datalist controler:
<a href='<%# Eval("images")%>' rel="lightbox[Brussels]">
<img alt="" src='<%# Eval("images")%>' height="150" width="150" class=" img img-thumbnail" />
</a>
I am not storing the images filepath. Just storing the images in varbinary(max) So cant give href attribute of Link.
I referenced hyperlink href attribute via dataurl.Its value is coming in base64
dr("images") = "data:Image/png;base64," & Convert.ToBase64String(imgbyte)
where imgbyte is byte array().
Whenever I am clicking on the Image(binded from database),it should come in front using Lightbox.
But problem is arousing as image poping out is partial clear or 30% clear rest blured or nothing at all.Don't know the exact reason why?
I have read somewhere that Internet Explorer 6 or 7 is not using dataurl. And it can show upto 32kb size image. But I have checked it in IE11.It does't work.
Any possibility how can we show images of big size using dataurl in LightBox?
Any other possibility how can we achieve this?
The only way I see is to implement a custom endpoint, say Generic Handler or a more tailored one, which returns a proper binary stream by providing the Identifier of the corresponding image.
For example
/MyCustomImageProvider.ashx?Id=1
This endpoint will be reachable via URL and such URL can be fed to LightBox, while keeping your images stored in a Table rather than a physical file.
In the end, your aspx code could like the following
<a href='<%# Eval("images")%>' rel="lightbox[Brussels]">
<img alt="" src="/MyCustomImageProvider.ashx?Id=<%# Eval("imageId")%>" height="150" width="150" class=" img img-thumbnail" />
</a>
i am trying to automate the login functionality of a site.I want to verify whether the tooltip is present or not and to capture the tooltip text displayed for the textboxes.The tooltip is displayed when trying to click on the login btn without filling the textboxes.The tooltip text is attached to the input elements via bootstrap javascript.No tilte attribute is present for the textboxes
https://elasticbox.com/login/ is the site address.Any ideas on how to capture the tooltip text .Thanks in advance
This is not a bootstrap tool-tip as you commented for #Varun's reply.
This is just the HTML5 form validation which comes into action when you put "required" as the attribute of textfield.
Make an html file 'test.html' file using the below code:
<html>
<body>
<form name='form1' post="http://www.google.com">
<input type='email' required placeholder='email address please' />
<input type='password' required placeholder='password please' />
<input type='submit' value='button1' />
</form>
</body>
</html>
Herein, when you click on "button1" (after opening the file in browsers like: Chrome, Firefox, etc.), you will see the necessary validation under the textfield(s).
But, there is no possible way to inspect them.
You can, however, use Sikuli/Autoit to check the presence of that validation text, but that again will be a lost cause as the image of the validation messages/tooltip differs from one browser to another.
Looks like developer needs to be consulted for this.
In javascript it seems like the signin button will remain disabled until both values are filled i.e. username and password.
I am not much into javascript, may be you can consult the developer in order to understand this more.
You can refer image below:
I'm creating one web application using ASP.NET MVC 4.0 and Jquery .
Me use uploadify for uploading files from client and i want to upload file on post action of my form, so basically my problem is while i'm selecting file it shows progressbar with file list and uploading progressbar but i want to show only file not progress bar.
stuck at this point - Any suggestion ?
so you don't need uploadify you just want multi file select
make form like this
<form action="processThem.php" method="post" enctype="multipart/form-data">
<input type="file" value="" name="upload[]" multiple>
<button type="submit">Upload!</button>
</form>
Square brackets in name of input type file are important also attribute multiple
see this post
http://www.hyperorg.com/blogger/2012/09/09/beginner2beginner-javascript-multi-file-upload-php-to-process-it/
I need to create a code to change an example text to a user-defined value when the user types in an input field (Similar to the preview field when writing a question on Stack Overflow).
This needs to be achieved without the use of HTML5 or Flash as the users will be running IE8, not all will have Flash plug-ins installed.
As such I have started by looking at DHTML to achieve the desired effect. Currently I can change the example text when a user types in the input field but only to a pre-defined value ("Example" in the code below), how should I edit this code to display the user-defined value?
JS
function changetext(id)
{
id.innerHTML="Example";
}
HTML
<form>
Content:<input type="text" id="input" onkeyup="changetext(preview)" />
</form>
<p id="preview">No content found</p>
You need to have something like this in the function:
function changetext(id){
var info = document.getElementById('input').value();
id.innerHTML = info;
}
This js is not fully correct. I would highly recommend you start using a javascript library like jQuery. It makes this a menial task.
Edited:
jQuery will work in IE8 just fine. in jQuery you will not need to attach js to your input. The code would look like this.
$('#input').click(function(){
$('#preview).html(this.val());
});
It is a lot cleaner and doesnt have js in the html.