If i click the button it will change the color in to orange but by requirement is after click the same button it need to change into default color. so please guid me to do this.
<button #val1 class="mat-raised-button" [ngClass]="{'orange': val1.value==current_product_size}" (click)="sizeFilter(val1.value)" value="375ML">375ML</button>
Component.ts
sizeFilter(size_clicked) {
this.current_product_size = size_clicked
}
**You can give more than one ngClasses if you want like this**
<button #val1 class="mat-raised-button"
[ngClass]="{'toggleColor': toggleColor,'orange': val1.value==current_product_size}"
(click)="sizeFilter(val1.value)"
value="375ML">375ML</button>
Component
toggleColor = false;
sizeFilter(size_clicked) {
this.toggleColor = !this.toggleColor;
this.current_product_size = size_clicked
}
CSS
.toggleColor{
background: yourDefaultColor !important;
}
Your html:
<button #val1 class="mat-raised-button" [ngClass]="{'orange': isOrange}" (click)="setOrange()">375ML</button>
Your component:
isOrange = false;
setOrange() {
isOrange = !isOrange;
}
Related
I'm using livewire with pagination. I set the input to defer so that the search is not carried out until the search button is clicked. However, I have also noticed that if I have any text in the search box that value is sent whenever a pagination button is clicked. I've tried setting the value to "" in jquery $(document).on("click", ".page-link", () => $( "#inlineFormInput" ).val("")); when a pagination buttton is click but that has not solved the problem. And actually clearing the value could cause other problems.
The desired result is that, if for some reason a user leaves text in the searchbox that value is not passed if the user changes their mind and just clicks a pagination link. The input value should only be passed when the search button is clicked. Any help would be greatly appreciated.
livewire component html:
<div id="searchBoxRow">
<input wire:model.defer="search" wire:keydown.enter="updateFaculty" id="inlineFormInput" class="form-control" val="" type="search" autocomplete="off" placeholder="Seach for Name or Country" aria-label="Search">
<button wire:click="updateFaculty" class="btn btn-primary" id="facultyCardsSearchButton" type="submit">
<i class="bi bi-search button-icon"></i>
<span class="button-text">Search</span>
</button>
</div>
livewire php file:
<?php
namespace App\Http\Livewire;
use App\Models\Tag;
use App\Models\Faculty;
use Livewire\Component;
use Livewire\WithPagination;
class FacultyData extends Component
{
use WithPagination;
protected $paginationTheme = 'bootstrap';
public $search = null;
public $tagId = null;
public function updateFaculty(){
$search = $this->search;
$tagId = $this->tagId;
$this->emit('closeAutocomplete');
}
public function updatingSearch()
{
$this->resetPage();
}
public function render()
{
$tags = Tag::all();
$allFaculty = Faculty::searchFilter([$this->search, $this->tagId])->with('country', 'tags')->paginate(10);
return view('livewire.faculty-data', [
'allFaculty' => $allFaculty,
'tags' => $tags
]);
}
}
Here is an idea. You can use the updatingPage() of the $page property hook. When performing the page switch clean the search property. But, somehow you need to check if this is a result of a searched data before or just the client has had his way...well, my idea is get a flagged property to tell livewire what to do. For example
public $searchFlag = false;
public function updateFaculty(){
if ($this->search) // only of search has any value
$this->searchFlag = true;
// do
}
public function updatingPage()
{
if (! $this->searchFlag) {
$this->reset(['search']);
}
if (! $this->search) {
$this->reset(['searchFlag']);
}
}
I am trying to do IE Automation through Excel VBA code.
I have a web page which has cells to add value. I need to change values in these cells by code vba excel
example:
Now cells in webpage has value : "11_now test"
My code vba excel:
ie.Document.getelementbyid("mx7125[R:0"]").Value = "Good" ' value i want to set
When run vba , webpage show value at cell is "Good" but when i click save button, the value at cell is "11_now_test"
HTML code is as below:
<input aria-labelledby="" id="mx7125[R:0]" class="fld text tt" ctype="textbox" li="mx7126[R:0]" db="mx5134" maxlength="200" style=";width:300px;" ontr='true' async='1' ae="setvalue" type="text" title="Remark: 11_now_test" value="11_now_test" ov="11_now_test" work="1" fldInfo='{"length":"200","inttype":"0"}'/></div><div aria-live="polite" id="mx7126[R:0]_holder" class="bc"><img sf="1" aria-hidden="true" active="0" ctype="image" alt="" src="../webclient/skins/skins-20171010-1330/tivoli09/images/blank.gif" source="blank" imgtype=".gif" style="display:inline;margin:0px;" border="0" lc="mx7125[R:0]" align="absmiddle" width='0px' height='26px' id="mx7126[R:0]" title=""/></div></td>
* More information*
Dear bros
when i press F12 to inspector on webpage. If click to change value on webpage, html code at this time is:
<input aria-labelledby="" id="mx7125[R:0]" class="fld text tt" ctype="textbox" li="mx7126[R:0]" db="mx5134" maxlength="200" style=";width:300px;" ontr="true" async="1" ae="setvalue" type="text" title="Remark: 11 Nov test" value="11 Nov test" ov="11 Nov test" work="1" fldinfo="{"length":"200","inttype":"0"}" originalvalue="11 Nov test" prekeyvalue="good" stoptcclick="true" keydown="false" changed_by_user="true" changed="true">
When type value " Good" to input cell on webpage ,prekeyvalue ="Good" and keydown will turn "True" then keydown back to "false"
* Javascrip at input cell *
when click to change value at input cell i found javascrip :
function tb_(eventOrComponent)
{
eventOrComponent = (eventOrComponent) ? eventOrComponent : ((window.event) ? window.event : "");
var eventType = eventOrComponent.type;
var textbox = this;
if(undef(eventType) || eventType=="text") {
eventType = "init";
textbox = eventOrComponent;
}
if(DESIGNMODE)
return;
var ro = textbox.readOnly;
var exc=(textbox.getAttribute("exc")=="1");
switch(eventType)
{
case "init":
setPromptValue(textbox.id);
break;
case "mousedown":
if(getFocusId()==this.id)
this.setAttribute("stoptcclick","true");
break;
case "mouseup":
if (isIE() && !hasFocus(this))
{
this.focus();
}
if (isBidiEnabled)
{
adjustCaret(eventOrComponent, this);
}
break;
case "blur":
input_onblur(eventOrComponent,this);
if (isBidiEnabled)
input_bidi_onblur(eventOrComponent, this);
break;
case "change":
if(!ro)
input_changed(eventOrComponent,this);
break;
case "click":
if(overError(eventOrComponent,this))
showFieldError(eventOrComponent,this,true);
var liclick=this.getAttribute("liclick");
var li=this.getAttribute("li");
if(li!="" && liclick=="1")
{
frontEndEvent(getElement(li),'click');
}
if(this.getAttribute("stoptcclick")=="true")
{
eventOrComponent.cancelBubble=true;
}
this.setAttribute("stoptcclick","false");
break;
case "focus":
input_onfocus(eventOrComponent,this);
if (isBidiEnabled)
input_bidi_onfocus(eventOrComponent, this);
this.select();
this.setAttribute("prekeyvalue",this.value);
break;
case "keydown":
this.setAttribute("keydown","true");
if(!ro)
{
lastKeyPress = eventOrComponent.keyCode;
if(eventOrComponent.ctrlKey && hasKeyCode(eventOrComponent,'KEYCODE_SPACEBAR')) {
stopBubble(eventOrComponent);
eventOrComponent.cancelBubble=true;
eventOrComponent.returnValue=false;
break;
}
if(isBidiEnabled)
processBackspaceDelete(eventOrComponent,this);
if(hasKeyCode(eventOrComponent, 'KEYCODE_DELETE') || hasKeyCode(eventOrComponent, 'KEYCODE_BACKSPACE'))
{
getHiddenForm().elements.namedItem("changedcomponentvalue").value = this.value;
}
if((hasKeyCode(eventOrComponent, 'KEYCODE_TAB') || hasKeyCode(eventOrComponent, 'KEYCODE_ESC')))
{
var taMatch = dojo.attr(this, "ta_match");
if(taMatch) {
if(taMatch.toLowerCase().indexOf(this.value.toLowerCase()) == 0)
{
console.log("tamatch="+taMatch);
this.value = taMatch;
input_keydown(eventOrComponent, this);
dojo.attr(this, {"prekeyvalue" : ""});
input_forceChanged(this);
inputchanged = false;
return; // don't want to do input_keydown again so preKeyValue will work
}
}
if(this.getAttribute("PopupType"))
{
var popup = dijit.byId(dojohelper.getPopupId(this));
if (popup)
{
dojohelper.closePickerPopup(popup);
if(hasKeyCode(eventOrComponent, 'KEYCODE_ESC'))
{
if (eventOrComponent.preventDefault)
{
eventOrComponent.preventDefault();
}
else
{
eventOrComponent.returnValue = false;
}
return;
}
}
}
}
input_keydown(eventOrComponent,this);
datespin(eventOrComponent,this);
}
else if(hasKeyCode(eventOrComponent,'KEYCODE_ENTER') || (hasKeyCode(eventOrComponent,'KEYCODE_DOWN_ARROW') && this.getAttribute("liclick")))
{
var lbId = this.getAttribute("li");
frontEndEvent(getElement(lbId), 'click');
}
else if(hasKeyCode(eventOrComponent,KEYCODE_BACKSPACE))
{
eventOrComponent.cancelBubble=true;
eventOrComponent.returnValue=false;
}
break;
case "keypress":
if(!ro)
{
lastKeyPress = eventOrComponent.keyCode;
if(eventOrComponent.ctrlKey==false && hasKeyCode(eventOrComponent,'KEYCODE_ENTER'))
{
var db = this.getAttribute("db");
if(db && db!="")
{
input_forceChanged(this);
sendClick(db);
// IV32363 - When default button is a new row button, then we must set focus on
// the button or the value in text box will be copied to the new row
if (db)
{
window.setTimeout("focusElement(document.getElementById('"+db+"'))", 10);
}
}
}
}
break;
case "keyup":
var keyDown = this.getAttribute("keydown");
this.setAttribute("keydown","false");
if(eventOrComponent.ctrlKey && hasKeyCode(eventOrComponent,'KEYCODE_SPACEBAR'))
{
if(showFieldError(eventOrComponent,this,true))
{
return;
}
else
{
menus.typeAhead(this,0);
}
}
if(!ro)
{
if(isBidiEnabled)
processBidiKeys(eventOrComponent,this);
numericcheck(eventOrComponent,this);
var min = this.getAttribute("min");
var max = this.getAttribute("max");
if(min && max && min!="NONE" || max!="NONE")
{
if(min!="NONE" && parseInt(this.value)<parseInt(min))
{
this.value=min;
getHiddenForm().elements.namedItem("changedcomponentvalue").value = this.value;
this.select();
return false;
}
if(max!="NONE" && parseInt(this.value)>parseInt(max))
{
this.value=max;
getHiddenForm().elements.namedItem("changedcomponentvalue").value = this.value;
this.select();
return false;
}
}
var defaultButton = false;
if(eventOrComponent.ctrlKey==false && hasKeyCode(eventOrComponent,'KEYCODE_ENTER'))
{
var db = this.getAttribute("db");
if(db && db!="")
{
defaultButton=true;
}
}
input_changed(eventOrComponent,this);
}
else
{
setFocusId(eventOrComponent,this);
}
if(showFieldHelp(eventOrComponent, this))
{
return;
}
if(keyDown=="true" && hasKeyCode(eventOrComponent, 'KEYCODE_ENTER') && !eventOrComponent.ctrlKey && !eventOrComponent.altKey)
{
menus.typeAhead(this,0);
return;
}
if(!hasKeyCode(eventOrComponent, 'KEYCODE_ENTER|KEYCODE_SHIFT|KEYCODE_CTRL|KEYCODE_ESC|KEYCODE_ALT|KEYCODE_TAB|KEYCODE_END|KEYCODE_HOME|KEYCODE_RIGHT_ARROW|KEYCODE_LEFT_ARROW')
&& !eventOrComponent.ctrlKey && !eventOrComponent.altKey)
{
menus.typeAhead(this,0);
}
break;
case "mousemove":
overError(eventOrComponent,this);
break;
case "drop":
input_onfocus(eventOrComponent,this);
if (isBidiEnabled)
{
input_bidi_onfocus(eventOrComponent, this);
}
this.select();
if(!ro)
{
this.setAttribute("prekeyvalue",this.value);
}
case "cut":
case "paste":
if(!ro)
{
var fldInfo = this.getAttribute("fldInfo");
if(fldInfo)
{
fldInfo = dojo.fromJson(fldInfo);
if(!fldInfo.query || fldInfo.query!=true)
{
setButtonEnabled(saveButton,true);
}
}
window.setTimeout("inputchanged=true;input_forceChanged(dojo.byId('"+this.id+"'));", 20);
}
break;
}
}
* HIDDEN FORM *
Dear #Zhi Lv - MSFT ! i tried sendkeys method but not success! i found the same problem at this link. Extractly that i want to change value in maximo website, has hiddenform but at that linked they use javascript, don't use IE automation vba excel.When i inspect at input cells and type document.getelementbyid("hiddenform") , found this hiddenform:
<form aria-hidden="true" id="hiddenform" name="hiddenform" method="POST" action="http://maximo.mysite.com/maximo/ui/maximo.jsp" style="padding:3px;">
<input type="text" size="45" name="event" id="event" title="event type"><br>
<input type="text" size="45" name="targetid" id="targetid" title="target id"><br>
<input type="hidden" size="45" name="value" id="value" value=""><!-- this must be type hidden to support \n in the value -->
<input type="text" size="45" name="changedcomponentid" id="changedcomponentid" title="changed component id"><br>
<input type="text" size="45" name="vischangedcomponentvalue" id="vischangedcomponentvalue" title="changed component value"><br>
<input type="hidden" name="changedcomponentvalue" value="">
<input type="text" size="45" name="currentfocus" id="currentfocus" title="focus id"><br>
<input name="scrollleftpos" id="scrollleftpos" size="45" title="Scroll Left"><br>
<input name="scrolltoppos" id="scrolltoppos" size="45" title="Scroll Top"><br>
<input type="text" size="45" name="uisessionid" id="uisessionid" value="4770" class="fld_ro" readonly="readonly" title="ui session id"><br>
<input type="text" size="45" name="csrftokenholder" id="csrftokenholder" value="ocvdjoiuq2ht8detn26pkjeekg" title="CSRF Token" readonly="readonly" class="fld_ro"><br>
</form>
thanks!!!
How do you get the input text value when click the save button? I have created a sample using the following code, it works well on my side. Please refer to it.
IE.Document.getelementbyid("mx7125[R:0]").Value = "Good"
And web page resource as below (using javascript script get the value document.getElementById('mx7125[R:0]').value):
<div>
<input aria-labelledby="" id="mx7125[R:0]" class="fld text tt" ctype="textbox" li="mx7126[R:0]"
db="mx5134" maxlength="200" style="width:300px;" ontr='true' async='1' ae="setvalue" type="text"
title="Remark: 11_now_test" value="11_now_test" ov="11_now_test" work="1" fldInfo='{"length":"200","inttype":"0"}' />
</div>
<div aria-live="polite" id="mx7126[R:0]_holder" class="bc">
<img sf="1" aria-hidden="true" active="0" ctype="image" alt="" src="../webclient/skins/skins-20171010-1330/tivoli09/images/blank.gif" source="blank" imgtype=".gif"
style="display:inline;margin:0px;" border="0" lc="mx7125[R:0]" align="absmiddle" width='0px' height='26px' id="mx7126[R:0]" title="" /></div>
<input id="btnSubmit" type="button" value="Submit" onclick="Javascript: alert(document.getElementById('mx7125[R:0]').value);" />
If still not working, please post the related code about the save button.
I'am sure there are events to the input fields. Like onChange(), onFocus(), onBlur() and/ or others. You can find out it if you press F12 on the tab with the opened page. Track through the tree of the DOM Inspector. In the row with your code snippet will be a button with the caption "event" at end of line. With a click on the button you can see which events there are.
In the past it was possible to trigger an event with fireEvent(). Another way is dispatchEvent() with some other methods like initEvent().
The words between [] are "outdated" ;-)
[What ever I tryed in the past, nothing worked. So I can't tell how you can solve your problem but I' am sure it is an event problem.]
This link shows you how it should work:
Vba, HTMLSelect: FireEvent OnChange or DispatchEvent
The words between [[]] are not relevant for IE11
[[Another more modern way is *addEventListener()*. But I don't know with which method the IE11 is working:
EventTarget.addEventListener()
The problem for me with *addEventListener()* is, the IE has not eventTarget() Constructer (see browser compatibility table at the bottom of the page):
EventTarget()]]
Edit 1:
In IE11 it works with dispatchEvent() and the other relevant things. You must place all commands in an own method. Two examples:
For onChange() use:
Private Sub Event_onChange(htmlDocument As Object, htmlElementWithEvent As Object)
Dim Event_onChange As Object
htmlElementWithEvent.Focus
Set Event_onChange = htmlDocument.createEvent("HTMLEvents")
Event_onChange.initEvent "change", True, False
htmlElementWithEvent.dispatchEvent Event_onChange
End Sub
For onKeyDown() use :
Private Sub Event_onKeyDown(htmlDocument As Object, htmlElementWithEvent As Object)
Dim Event_onKeyDown As Object
htmlElementWithEvent.Focus
Set Event_onKeyDown = htmlDocument.createEvent("HTMLEvents")
Event_onKeyDown.initEvent "onkeydown", True, False
htmlElementWithEvent.dispatchEvent Event_onKeyDown
End Sub
I know that now because we disscuss this right now in a german forum. The solution with the own sub() is from the user Anton (not involved in the discussion). With Antons sub() I figure out right now how the German Post will let a macro insert adresses in an order blank.
The german discussion:
Webformular (DHL) ausfüllen
Or after one week in the archive:
Webformular (DHL) ausfüllen (archive thread)
Edit 2:
I think you must trigger the onKeyDown event. Try the following:
Dim nodeInput As Object
Set nodeInput = ie.Document.getelementbyid("mx7125[R:0]")
Call TriggerEvent(ie.Document, nodeInput, "onKeyDown")
nodeInput.Value = "Good"
Here is the function to trigger an event like QHarr wrote in the comments with the event type as third function parameter:
Private Sub TriggerEvent(htmlDocument As Object, htmlElementWithEvent As Object, eventType As String)
Dim theEvent As Object
htmlElementWithEvent.Focus
Set theEvent = htmlDocument.createEvent("HTMLEvents")
theEvent.initEvent eventType, True, False
htmlElementWithEvent.dispatchEvent theEvent
End Sub
In the above linked german forum the Deutsche Post form works now with this function. But it is necessary to put in all values two times.
We don't know anything about your page. The url seems to be a secret. If you need more help we need more infos.
I have a div in my html:
.row(id="div_amount")
.col-sm-2
label(for="amount") Amount:
.col-sm-1
input(type="text", name="amount")
which is perfect as I expected. It displays in one line for both elements.
I have a radio button which have an onclick event for toggle the display of this div section.
function div_toggle() {
div_amount = document.getElementById('div_amount');
if (radio_value === 0) {
div_amount.style.display = "block";
} else {
div_amount.style.display = "none";
}
}
However, after click on the radio button, it always displays as two lines.
How could I fix it to always display in one line?
Please take a look at https://stackoverflow.com/help/mcve and try to include a reproducible example.
In bootstrap4, rows are displayed as flex, i.e., "display: flex;". So in your JavaScript if you change it to display as block, the columns within the row would be broken.
You can set its display to flex, like
if (radio_value === 0) {
div_amount.style.display = "flex";
} else {
div_amount.style.display = "none";
}
although setting HTML element styles in JavaScript is considered as bad practice IMO.
I have a Kendo UI datepicker with placeholder data. Here is the HTML:
<input type="text" class="datepicker"' placeholder="yyyy-mm-dd" />
Here is the JavaScript:
var start = $(".datepicker").kendoDatePicker({
format: "yyyy-MM-dd",
parseFormats: ["MM/dd/yyyy"],
change: startChange
}).data("kendoDatePicker");
The Kendo UI datepicker displays the placeholder data in the same style as user entered data. I would like to style the placeholder data differently. Specifically, I would like the text to be gray and italicized. When user enters data, the style changes to solid black (non-italicized). Any thoughts on how to do this?
Well, placeholder is an HTML5 attibute and isn't specic to Kendo controls. As I understand it Kendo doesn't offer any support for placeholder over what is supported by the browser, and remember that only some browsers support this attribute; IE does not.
Anyway, to style the placeholder you'll have to use vendor prefix CSS properties, see here.
I use this..it will work on your HTML and you can style it too :)
<script>
// This adds 'placeholder' to the items listed in the jQuery .support object.
jQuery(function() {
jQuery.support.placeholder = false;
test = document.createElement('input');
if('placeholder' in test) jQuery.support.placeholder = true;
});
// This adds placeholder support to browsers that wouldn't otherwise support it.
$(function() {
if(!$.support.placeholder) {
var active = document.activeElement;
$(':text').focus(function () {
if ($(this).attr('placeholder') != '' && $(this).val() == $(this).attr('placeholder')) {
$(this).val('').removeClass('hasPlaceholder');
}
}).blur(function () {
if ($(this).attr('placeholder') != '' && ($(this).val() == '' || $(this).val() == $(this).attr('placeholder'))) {
$(this).val($(this).attr('placeholder')).addClass('hasPlaceholder');
}
});
$(':text').blur();
$(active).focus();
$('form:eq(0)').submit(function () {
$(':text.hasPlaceholder').val('');
});
}
});
</script>
The WebBrowser control has a property called "IsWebBrowserContextMenuEnabled" that disables all ability to right-click on a web page and see a context menu. This is very close to what I want (I don't want anyone to be able to right-click and print, hit back, hit properties, view source, etc).
The only problem is this also disables the context menu that appears in TextBoxes for copy/paste, etc.
To make this clearer, this is what I don't want:
This is what I do want:
I would like to disable the main context menu, but allow the one that appears in TextBoxes. Anyone know how I would do that? The WebBrowser.Document.ContextMenuShowing event looks promising, but doesn't seem to properly identify the element the user is right-clicking on, either through the HtmlElementEventArgs parameter's "FromElement" and "ToElement" properties, nor is the sender anything but the HtmlDocument element.
Thanks in advance!
have you considered writing your own context menu in javascript? Just listen to the user right clicking on the body, then show your menu with copy and paste commands (hint: element.style.display = "block|none"). To copy, execute the following code:
CopiedTxt = document.selection.createRange();
CopiedTxt.execCommand("Copy");
And to paste:
CopiedTxt = document.selection.createRange();
CopiedTxt.execCommand("Paste");
Source:
http://www.geekpedia.com/tutorial126_Clipboard-cut-copy-and-paste-with-JavaScript.html
NOTE: This only works in IE (which is fine for your application).
I know its not bulletproof by any means, but here is a code sample that should get you started:
<html>
<head>
<script type = "text/javascript">
var lastForm = null;
window.onload = function(){
var menu = document.getElementById("ContextMenu");
var cpy = document.getElementById("CopyBtn");
var pst = document.getElementById("PasteBtn");
document.body.onmouseup = function(){
if (event.button == 2)
{
menu.style.left = event.clientX + "px";
menu.style.top = event.clientY + "px";
menu.style.display = "block";
return true;
}
menu.style.display = "none";
};
cpy.onclick = function(){
copy = document.selection.createRange();
copy.execCommand("Copy");
return false;
};
pst.onclick = function(){
if (lastForm)
{
copy = lastForm.createTextRange();
copy.execCommand("Paste");
}
return false;
};
};
</script>
</head>
<body oncontextmenu = "return false;">
<div id = "ContextMenu" style = "display : none; background: #fff; border: 1px solid #aaa; position: absolute;
width : 75px;">
Copy
Paste
</div>
sadgjghdskjghksghkds
<input type = "text" onfocus = "lastForm = this;" />
</body>
</html>
//Start:
function cutomizedcontextmenu(e)
{
var target = window.event ? window.event.srcElement : e ? e.target : null;
if( navigator.userAgent.toLowerCase().indexOf("msie") != -1 )
{
if (target.type != "text" && target.type != "textarea" && target.type != "password")
{
alert(message);
return false;
}
return true;
}
else if( navigator.product == "Gecko" )
{
alert(message);
return false;
}
}
document.oncontextmenu = cutomizedcontextmenu;
//End:
I hope this will help you Anderson Imes
A quick look at the MSDN documentation shows that none of the mouse events (click, button down/up etc) are supported to be used in your program. I'm afraid its either or: Either disable conetxt menus, or allow them.
If you disable them, the user can still copy & paste using keyboard shortcuts (Ctrl-C, Ctrl-V). Maybe that gives you the functionality you need.
We ended up using a combination of both of the above comments. Closer to the second, which is why I gave him credit.
There is a way to replace the context menu on both the client-side web code as well as through winforms, which is the approach we took. I really didn't want to rewrite the context menu, but this seems to have given us the right mix of control.