2

I have a textbox and an image. When the user inserts text into the textbox I want to change the image shown. My doubt is how to do this in a MVVM way and in a "clean" way (following best practices).

<textbox id="searchTextbox" onChanging="@command('search')"/>
<image id="searchImage" src="/img/textbox/search-icon.png" ca:blueeyename="searchImage" />

The way I have to achieve this seems to me to be "cumbersome": change image to:

<image id="searchImage" src="@load(vm.imageSrc)" ca:blueeyename="searchImage" />

and then in my viewModel I have the "imageSrc" variable. On my "search" command I change the imageSrc variable to the correct value.

My solution seems a bit ugly as I have to create a variable on my ViewModel. I would expect to achieve all this on my .zul file.

Any way to do this in a cleaner way?

AlfaTeK
  • 7,487
  • 14
  • 49
  • 90

1 Answers1

3

AlfaTeK,

You are 100% doing MVVM. You don't wire textbox to your controller but set a variable that represents the src.

I have already reviewed a lot of code of people who where thinking doing MVVM and just keep on mixing MVC and MVVM.

(also congratz to use @load and not @bind, its logic but strange enough lot's of people use for almost everything @bind)

A cleaner way isn't there but if you really want to do it in your zul you can use <zscript> but personally for me thats just uglier.

Greetz chill.

AlfaTeK
  • 7,487
  • 14
  • 49
  • 90
chillworld
  • 4,207
  • 3
  • 23
  • 50
  • thanks for the feedback. My "itch" is creating a new field on my MVVM "just" for this, but I guess that is the cleanest way – AlfaTeK Feb 27 '14 at 21:09
  • I know its strange in the beginning, but on the other hand you don't have your visual components in your VM like the wiring of the Textbox in mvc. – chillworld Feb 28 '14 at 07:43