StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>Why don't you simply use a clientHandler just as you did on the 'add' button? You could target the preceding 'remove' button and disable it each time you create a new one and change /update each time you remove one row.</p> <p>EDIT : I can suggest you something, feel free to have a look, I changed a bit the approach but it is working and I hope you'll find it at least interesting ;-)</p> <p><a href="https://script.google.com/macros/s/AKfycbwkkAzM35SFubfPRjCkcSF81bswCE395uM9XyizV8tv5XsbAlI/exec" rel="nofollow">Link to the online test</a></p> <pre><code>function doGet() { var app = UiApp.createApplication(); var counter = app.createHidden().setName('counter').setId('counter').setValue('1'); var mainContainer = app.createVerticalPanel().setId('mainContainer') app.add(mainContainer.add(counter)); var event1Container = app.createHorizontalPanel() var showInstance = app.createLabel('1') var addButton = app.createButton('Add') .setId('add1') .addClickHandler(app.createClientHandler() .forEventSource().setEnabled(false)) //avoiding multiple click during server response .addClickHandler(app.createServerHandler('add') .addCallbackElement(mainContainer)); var removeButton = app.createButton('X') .setId('remove1') .addClickHandler(app.createServerHandler('remove') .addCallbackElement(mainContainer)); mainContainer.add(event1Container .add(showInstance) .add(addButton) .add(removeButton)); return app; } function add(inst) { var app = UiApp.getActiveApplication(); var hiddenVal =inst.parameter.counter; var counterVal = Number(hiddenVal); var mainContainer = app.getElementById('mainContainer') var counter = app.getElementById('counter') ++ counterVal counter.setValue(counterVal.toString()) var eventContainer = app.createHorizontalPanel().setId('eventContainer'+counterVal) var showInstance = app.createLabel(counterVal.toString()) var addButton = app.createButton('Add') .setId('add'+counterVal) .addClickHandler(app.createClientHandler() .forEventSource().setEnabled(false)) //avoiding multiple click during server response .addClickHandler(app.createServerHandler('add') .addCallbackElement(mainContainer)); var removeButton = app.createButton('X') .setId('remove'+counterVal) .addClickHandler(app.createServerHandler('remove') .addCallbackElement(mainContainer)); app.add(eventContainer .add(showInstance) .add(addButton) .add(removeButton)); if(counterVal>1){app.getElementById('remove'+(counterVal-1)).setEnabled(false)} return app; } function remove(inst) { var app = UiApp.getActiveApplication(); var counterVal = Number(inst.parameter.counter); var counter = app.getElementById('counter') if(counterVal ==1) {return app} var maincontainer = app.getElementById('mainContainer') app.getElementById('eventContainer' + counterVal).setVisible(false) --counterVal counter.setValue(counterVal.toString()) app.getElementById('add'+counterVal).setEnabled(true) app.getElementById('remove'+counterVal).setEnabled(true) return app; } </code></pre> <p>NOTE : I didn't make use of <code>.remove(widget</code>) since this is a fairly new method and I don't know exactly how it works... I'll test it later. Until then I used <code>setVisible(false)</code> instead, sorry about that :-)</p> <p>Note 2 : I didn't use the cache since the hidden widget is sufficient to keep track of what is going on... if you needed it for something else then you could always add it back .</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload