Hoping for some advice here, I'm quite new to javascript and coding in general so I'm sure there are better ways to do what I need, however any help much appreciated ....
I have a piece of javascript that creates a table, the amount of rows being dynamic.
When I call the javascript I'm passing a few bits of info over, and one of these is an array. The array contains in each element a long string of text.
So I create the table with X rows showing some identifying data. I also create a radio button for each row with an on click event. The idea being that when the user clicks on the radio button, then the long string from the array element will be displayed in a separate text box.
I have managed to get to the point that the table is created and that when the radio button is selected the onclick event fires and loads a piece of data into the txt box. However that piece of data is hardcoded (txtbox.value=array[1])
What I'm now trying to do is load the relevant string from the array, depending on what radio button is clicked.
If i change my onclick event to onclick=function(ID) and my function to function(ID) I'm getting an error 'Not implented'
It appears to be generated from the onclick event rather than the function ...
The following works :
R1.onclick=clicktest;
function clicktest()
{
txtbox.value=array[1]
}
The following generates the error
R1.onclick=clicktest(1);
function clicktest(id)
{
txtbox.value=array[id]
}
Apologies if this isn't so clear.
Using this code
R1.onclick=clicktest(1);
You're executing clicktest(1) and assigning the result as event handler.
You could change it by this in to make it work
R1.onclick = function() { clicktest(1) };
Related
Hi I have a button that inserts empty records into an interactive grid. I want to prevent the user from being able to double click that button because it populates duplicate rows. I have a server side argument that says if there are rows the button does not appear however they are still able to double click the Populate_tables button before it vanishes. If there are any other solutions to this please sound off. I've tried everything from javascript to server-side but they are still able to double click no matter what. Here are the before and after pictures of the table.
$('#btnPopulateTbl').dblclick(function(e){
e.preventDefault();
});
The above code prevents the double click for a button. This is in jQuery.
Oracle Apex does not offer this functionality as a setting or etc.
However you can use
$('#button').click(function(event) {
if(!event.detail || event.detail == 1){
// This will be executed once even user clicks multiple times
}
});
Note that your selector must be the id or the class you provide to this button.
By default 'add row' button's classes are:
class="a-Button a-Toolbar-item js-actionButton"
Another solution would be to have apex handle this. Suppose this is on page 1.
Create a page item P1_POPULATE_ROWS_CLICKED with a default value of 'N'
In the page process that populates the table, add the following line before the actual load:
:P1_POPULATE_ROWS_CLICKED := 'Y';
Add a condition to the page process that populates the table of "Item not equal to value", P1_POPULATE_ROWS_CLICKED , Y
Yet another solution is to only execute the insert statement if no rows exist with that condition yet. I can't show you how to do it because you didn't show how the table is populated but happy to do so if you edit your question. This last option is propably the most suitable.
so I have this basic bootstrap form and I have a button called add another location which will dynamically create another 4 inputs to add more location. This is achieved via jquery and jquery UI. So I made 3 copies of this form and put them in a list because eventually, they are going to come from a server and loop the form depends on however many sets of information available. The problem I am having is that, only my first add another location button works and it's creating additional inputs on the second and third one as well. I can give different id/class to the buttons where the new form goes but that wouldn't do me any good since more or fewer forms can be displayed via the server. My question is how can each button act independently without giving different id/class to it. so if I click add another location button on the second set of form, it only creates additional inputs on the second set not first or 3rd, same for 1st set and 3rd set.
this is the jquery code that clones and appends the new inputs
$("#pm-do-clone1").click(function () {
$(".pm-clone-this3 .pm-clone4").clone().appendTo(".pm-clone-here1");
});
here's my jsfiddle : https://jsfiddle.net/jaisilchacko/yqvd4Lvv/4/
ps: the fiddle the first add location is not creating new inputs, but it works on my local.Probably an external resource issue
alright, as I understand You gotta grab the clicked button by referancing it with;
$("#pm-do-clone1").click(function () {
$(this).//rest of the code
and at the rest of the code as we captured the clicked one, we now have to find its parent where we gonna add the new inputs. For example,
var y = document.createElement('input');
var x =$(this).parents('.form');
$(x).append(y);
Edit: Btw, you are clicking an ID, ID is not the best model to catch one from multiple elemets because it sometimes make mistakes, use class instead.
Edit2: Check this snippet too. I belive this will help you. View DEMO
Edit3: Why do you wrapping each inputs into divs? It seems not necessary no create too much elements as you could achive the same result with only inputs.
I have a C#/.NET web application I am working on. On one of the pages I have a table of values generated from a database. I need each value to be clickable so that when you click a value it filters data in a separate table next to it.
So what I decided to do was to make each value into a button:
<input type="button" id="exampleID" class="exampleClass" value="#Model.Data.Value1" />
In my Javascript I have this:
$(".exampleClass").click(function () {...
The code inside the function isn't relevant to the question because it isn't getting called when I click the button. Each button has a unique ID that I am using in my function and I gave them each the same class so that I can catch when any of them are called and then use their unique ID to determine which was clicked. I have set a breakpoint inside the function using Firebug but it's not getting tripped when I click the button. I am stumped as to why this isn't working.
Could be any number of things: are you attaching the click event in the ready method? Is jQuery even loaded on the page? Have you tried refining the selector? For example, $('input.exampleClass').click(). It has to be some dumb mistake.
I'm attempting to input some values into the grid's new row template from outside the grid since selecting this particular input would be more than impractical to get done from inside de webdatagrid.
How can I reach the to be added row via javascript from outside the control? According to the documentation ig_controls.wdgTransaccion.get_behaviors().get_editingCore().get_behaviors().get_rowAdding().get_row(); should do the trick, but it fails to return any row at all
Thank you
Are you sure you calling this from the right place? Can't really tell without more context, however I think i can help you get the functionality you need. Have a look at this sample:
ASP.NET Data Grid: Add New Row - Client Events
The best place I can think of doing this is probably at the time of actual editing happening, so have a look at the EnteringEditMode event and you can do the following inside:
function WebDataGridView_EnteringEditMode(webDataGrid, evntArgs) {
webDataGrid.get_behaviors().get_editingCore().get_behaviors().get_rowAdding().get_row().get_cell("1").set_value("test");
}
Or if you want to do it on your own flow you can grab the grid client object and use the same code as the event above:
var webDataGrid = $find('<%=WebDataGrid1.ClientID%>');
webDataGrid.get_behaviors().get_editingCore().get_behaviors().get_rowAdding().get_row().get_cell("1").set_value("test");
Both of those methods work and allow you to fill in a cell value.
I want to show a button (for example, span.mybutton) next to every instance of a specified element (for example, a table) in TinyMCE—and then, when that button is clicked, grab that specific element's html, process it, and update it in the editor.
I can handle the processing, but I can't figure out how to display the button and pass in grab the specific element's html. If I do this, for example, it adds the html of span.mybutton to TinyMCE as if it were regular content, which I don't want:
jQuery('iframe#content').contents().find('table').append('<span class="mybutton">My button</span>');
Here's what I'm trying to do:
function processElement( element, values ) {
// do stuff to the table html (I don't need help with this part)
return element;
}
function appendButtonToTinyMCEElement ( button, element ) {
// put button next to all instances of the specified element in TinyMCE
// (in this case, put span.mybutton at the corner of all tables)
}
$('.myhelperbutton').click(function(){
var element = ??? // get content of the element whose button was clicked
var element = processElement( element );
// send element back to TinyMCE (not sure how)
});
So, my two questions are:
How can I display the button in the right place without affecting the html that gets saved in TinyMCE? And, when the button is clicked, how do I get/set just that element from TinyMCE?
If I understand correctly you wish to grab all table DOM elements, and place a button next to it which does some stuff.
Below is my first thought. I am going to make convenient assumptions to make it easier, but let me know if I made some wrong assumptions somewhere. I also don't know how much javascript/jquery you already know, so let me know if I didn't explain something clearly.
jQuery('iframe#content').contents().find('table').each(function(index, element) {
// create a new button.
var $btn = $('<input type="button" class="mybutton"></input>');
function action() {
// This is using the `processElement` function you defined in your question,
// I am applying it to the specific table just grabbed.
processElement(element);
}
$btn.click(action);
// This should append the button. See http://api.jquery.com/after/
$(element).after($btn[0]);
});
Let me know if this works for you or not.