ng-file-upload with dropify not showing thumbnails - ng-file-upload

I'm trying to use ng-file-upload and dropify like this:
<input type="file" id="input-file-a" class="dropify"
ngf-select ng-model="ctr.picFile" />
Uploading is working well, but dropify isn't.
The problem is that dropify is no longer showing any thumbnail previews, any ideas?

Related

Bootstrap file input does not show the image name which is browsed

I'm using Admin LTE theme and I have added this input for uploading image:
<div class="form-group">
<label for="sendImage">Send Image</label>
<div class="input-group" id="dyanimc-field2">
<div class="custom-file" >
<label class="custom-file-label" for="exampleInputFile">Choose file</label>
<input type="file" class="custom-file-input" id="sendImage" name="product_image[]">
</div>
</div>
</div>
But when I browse and image, it should be showing the image name which is selected but it doesn't!
So by default it looks like this:
And when I choose an image it should be showing image name instead of Choose file, like this:
So what's going wrong here? How can I show the image name when it's selected before uploading?
I can across similar problem while designing a custom user dashboard using Admin LTE HTML template.
After few googling, I realized it was a known issue in bootstrap, this github issue comment solved the problem for me.
I was able to get it working using this third-party library and the lines of code below solved it for me.
<script src="https://cdn.jsdelivr.net/npm/bs-custom-file-input/dist/bs-custom-file-input.min.js"></script>
<script>
$(document).ready(function () {
bsCustomFileInput.init()
})
</script>

Ionic 4 not showing external images

I need to display external images but image loading only works well in
ionic serve
My code is like this:
<img [src]="user?.img.url" />
or
<div *ngIf="user">
<img [src]="user.img.url" />
</div>
but the images are not been loaded in mobile
if I copy the link contained in user.img.url and write a code like this:
<img src="'https://res.cloudinary.com/ddon9fx1n/image/upload/v1567797308/rvnpdvy9dsj9ws8tiatj.jpg'" />
then it always works in ionic serve or in mobile
With some images all the above code works... I am using Cloudinary to storage media files

webview control: how do post data from the app to a field on the webpage?

i would like to have full control over the webview control. for instance, i would like to know if it is navigating or if it has completed navigating to the desired page. I would then wish to push same data from the app like the user name and password to a field on the page that was opened by the webview.
Could you point me to some examples or tutorials please?
Thank you!
Rely on the following post for javascript injection:
Inject javascript into WebChromeClient
Now just change the underlying javascript. It is important to understand that the Javascript directly is affected by the HTML, so if the HTML is changed, the Javascript (and probably also your app, require an update).
So in case you got the following HTML:
<form action="#" autocomplete="on">
<input type="text" name="username" placeholder="Username" />
<input type="password" name="password" placeholder="Password" />
<button type="submit">Login</button>
</form>
The javascript would look like the following, to
set the username
set the password
autologin by clicking login button
$('input[name=\"username\"]').val('%#'); // 1.
$('input[name=\"password\"]').val('%#'); // 2.
$('.login').click(); // 3.
Now just load this by the webview:
public void onPageFinished(WebView view, String url)
{
String loadPasswordJS = "$('input[name=\"username\"]').val('%#'); $('input[name=\"password\"]').val('%#'); $('.login').click();";
view.loadUrl(loadPasswordJS);
}

Load image from web page, captcha, fill textfield

Good evening. In my application I need to send a request to a web page that needs a captcha. The image link is a .php and the captcha change every time I refresh the page. So, if I try to download the image "by link", I have a different captcha. What is the solution? Any idea? Thank you in advance.
EDIT: Now I have to fill the input and send the request to submit. This is the html source of textfields I have to fill:
<label class="ins" for="targ">Targa del veicolo:</label>
<input id="targ" name="targa" value="" type="text" size="20" maxlength="8" tabindex="2" />
<label for="inCaptchaChars">Codice di sicurezza:</label> <input type="text" id="inCaptchaChars" name="inCaptchaChars" tabindex="1004" onblur="ShutMeDown()">
And this is about the submit button:
<input type="submit" name="procedi" value="Calcola importo" />
What I have to do to proceed? I have to use ASIHTTP?
This might be a little convoluted, but it should work alright:
Use a webView, load the page, when the page loaded call some javascript on the webview (stringByEvaluatingJavascript) that gets the image size and offset. Resize the WebView frame to that size, and scroll the content to that offset. Disable user interaction and show the webview.
To get the element offset you can use this answer
Simply call:
[[webView stringByEvaluatingJavascript:#"function getOffset(el) { ..... } getOffset( document.getElementById('yourElId') ).left;"] floatValue];
not that you must pass the whole code to this method
To submit the captcha:
As before, call
[webView stringByEvaluatingJavascript :#"document.getElementsByName('procedi')[0].value = 'your captcha';"];
then do the same to call .click() on the submit button or .submit() on the form

Strange IE form file select bug

I am making a simple image uploader. Since normal file selected cannot be styled do i use a bit of javascript to overcome this. There's just one problem, when someone using IE trys to upload a file by pressing the "fake" file select bar and press submit the selected image disappear. Do anyone know why this happens?
Try it for yourself
File score (same as in link above):
<form action="fileUploadBugIE.php" method="POST" enctype="multipart/form-data" character_set="UTF_8" >
<input type="text" readonly="readonly" id="filePath" onclick="document.getElementById('fileUL').click();" /><br /><br />
<input type="file" name="imageFile" id="fileUL" onchange="document.getElementById('filePath').value = this.value;"/><br />
<input type="submit" value="Submit" />
</form>