I need to build a confirm button for the images being dropped in Dropzone, which, on press will store the image in a variable and then move on. What function do I call to get this image?
I currently only have this set up:
<div id=dropzone >
<form action="/file-upload" class="dropzone">
<div class="fallback">
<input name="file" type="file" multiple />
</div>
</form>
<img id=confirmbtn src="/images/confirm.png" alt="Confirm">
<img id=cancelbtn src="/images/cancel.png" alt="Click me to remove the file." data-dz-remove />
</div>
I am looking to store the image as a string
I did a ctrl+f (data-dz-thumbnail) on dropzone.js and found this in the preview:
<-this is ONE LINE BTW->
previewTemplate: "<div class=\"dz-preview dz-file-preview\">\n
<div class=\"dz-image\">
<img id='data-dz-thumbnail'data-dz-thumbnail />
</div>\n <div class=\"dz-details\">\n
<div class=\"dz-size\"><span data-dz-size></span></div>\n
<div class=\"dz-filename\"><span data-dz-name></span></div>\n
</div>\n
<div class=\"dz-progress\"><span class=\"dz-upload\" data-dz-uploadprogress></span></div>\n
</div>",
I then changed the whole image thumbnail element to this:
<img id='data-dz-thumbnail'data-dz-thumbnail />
//I added the id='data-dz-thumbnail' part
Then i added an event listener to js
something.onclick....{
var image=document.getElementById('data-dz-thumbnail').src
}
And that is literally it
I am having the following Piece of Code:
<div class="custom-control custom-checkbox" *ngFor="let airline of airlines">
<input type="checkbox" (click)="airLineFilter($event)" value="{{airline}}" name="{{airline}}" class="custom-control-input">
<label class="custom-control-label" for="{{airline}}">{{airline}}</label>
</div>
When this was without *ngFor (click) event was working fine like this:
<div class="custom-control custom-checkbox">
<input type="checkbox" id="americanAir" (click)="airLineFilter($event)" value="American Airlines" name="airlines" class="custom-control-input">
<label class="custom-control-label" for="americanAir">American Airlines</label>
</div>
But after using *ngFor click event is not getting triggered. Is there something I can do to fix this.?
After going through many options I finally found the solution.
It is due to Id attribute of checkbox and for attribute of label.
When I changed my code to something like this it worked:
<div class="custom-control custom-checkbox" *ngFor="let airline of airlines;let i = $index;">
<input type="checkbox" id="airline{{i}}" (click)="airLineFilter($event)" value="{{airline}}" name="{{airline}}" class="custom-control-input">
<label class="custom-control-label" for="airline{{i}}">{{airline}}</label>
</div>
i am trying add and remove rows dynamically and select tag at one column in table but its not working
Javascript
function addRowDynamically()
{
rowCount++;
$(itemDetails).append("<div><div> <div><s:select label="search engine" headerKey="-1" headerValue="Engines" list="itemlist" name="itemName" /></div> </div> <div> <div id='product_details'> <input type='text' name='product_details[]' /> </div> </div></div>");
reCalcRow();
}
and jsp file
$(itemDetails).append("<div><div> <div><s:select label="search engine" headerKey="-1" headerValue="Engines" list="itemlist" name="itemName" /></div> </div> <div> <div id='product_details'> <input type='text' name='product_details[]' /> </div> </div></div>
problem is select tag in javascript is not working
I have a shiny app that conducts t-test between two independent samples. Based on a radio button choice, you can either input summary statistics (\bar{x}, sd, n) for both samples, or you can copy/paste or type in the values of each sample. The renderUI function looks something like this:
output$ui<-renderUI({
switch(input$option,
"Summary Stats" =
c(textInput("barx1","$$\\bar{x}_1$$", "0"),
textInput("picksd1", "$$sd_1$$", "1"),
textInput("n1","$$n_1$$","10"),
textInput("barx2", "$$\\bar{x}_2$$","1"),
textInput("picksd2", "$$sd_2$$","1"),
textInput("n2","$$n_2$$","10")),
"Input Data" = c(tags$textarea(id="foo1", rows=10, cols=38), tags$textarea(id="foo2", rows=10, cols=38)))
})
The textInputs render and work fine in the UI, but the text boxes don't, any help here? I have something very similar for a one sample case, where foo1 works fine, the problem seems to be that I want two text boxes and maybe that I have them stored in c() form, though this works fine for the textInputs. Thanks in advance for any help.
I managed to make this work by using html code instead of "tags". Not sure why tags$textarea didn't work when used in c(tags$textarea, tags$textarea) form but this looks a lot cleaner anyway:
output$ui<-renderUI({
switch(input$option,
"Summary Stats" = HTML(
'<div class="form-group shiny-input-container">
<label for="barx1">$$\\bar{x}_1$$</label>
<input id="barx1" type="text" class="form-control" value="0"/>
</div>
<div class="form-group shiny-input-container">
<label for="picksd1">$$sd_1$$</label>
<input id="picksd1" type="text" class="form-control" value="1"/>
</div>
<div class="form-group shiny-input-container">
<label for="n1">$$n_1$$</label>
<input id="n1" type="text" class="form-control" value="10"/>
</div>
<div class="form-group shiny-input-container">
<label for="barx2">$$\\bar{x}_2$$</label>
<input id="barx2" type="text" class="form-control" value="1"/>
</div>
<div class="form-group shiny-input-container">
<label for="picksd2">$$sd_2$$</label>
<input id="picksd2" type="text" class="form-control" value="1"/>
</div>
<div class="form-group shiny-input-container">
<label for="n2">$$n_2$$</label>
<input id="n2" type="text" class="form-control" value="10"/>
</div>'
),
"Input Data" = HTML(
'<div class="form-group shiny-input-container">
<label for="foo1">Sample 1</label>
<textarea id="foo1" rows="10" cols="38"></textarea>
</div>
<div class="form-group shiny-input-container">
<label for="foo2">Sample 2</label>
<textarea id="foo2" rows="10" cols="38"></textarea>
</div>'
))
})
I am new to Thymeleaf. I am trying to add a class based on the selected radio button in a for loop.
<div class="btn-group" data-toggle="buttons">
<div th:remove="tag" th:each="obj : ${T(com.sab2i.esabplugin.model.NatureEnum).values()}" >
<label class="btn btn-primary" th:classappend ="...?'active'">
<input type="radio" autocomplete="off" th:field="*{nature}" th:value="${obj}" />
<span th:text="#{${obj.value}}">Radio</span>
</label>
</div>
</div>
what test should I be making to compare the value of "nature" against the value of loop variable "obj", in order to add the "active" class in th:classappend?
Thank you.
did you try th:classappend="(${obj} eq *{nature})? 'active'"
if *{nature} is a String try th:classappend="(${obj.name()} eq *{nature})? 'active'"