All Answers

Hi Ulisses,

can you please wrap a small test case showing what you tried already?

Best regards
Frank

Hi Carl,

if you can wrap up the DGV that has these issues in a test case, we can take a look.
Otherwise it’s impossible from here to guess why it behaves in a different way compared to the other 4.

Best regards
Frank

Hi,

that’s by design, read here

https://docs.wisej.com/docs/controls/general/autosizing#html-autosizing

Best regards
Frank

Yes, there is a better way.
Use EditingControlShowing (e.Control is the ComboBox).

In the handler simply do:
((ComboBox)e.Control).SelectedIndexChanged -= ...
and ((ComboBox)e.Control).SelectedIndexChanged += ...

Doing always -= and += ensures that there is only one handler attached.

Alternatively, you could create a custom column and override OnSelectedItemChanged in DataGridViewComboBoxEditingControl.

Hey Konstantin,

There is no popup window in a Hybrid app – only application redirects. So the onclose handler will not work. There shouldn’t be any reason to put the current thread to sleep while waiting.

You might want to look at the Application.ApplicationRefresh event handler to manage a redirect.

If you attach a small runnable sample we can try to provide more help!

Best regards,
Levie

We’re working on a fix that will be included with the next release of Wisej.NET.

In the meantime, the workaround is to do Me.DataGridView1.AllowUserToAddRows = True in the Load event instead of setting it in the designer.

-Julie

Thank you,

all solved 🙂

Hi guys,

I’m trying to access the PDFViewerApplication object myself, and I came across this thread. I downloaded Alaa’s example application from 2022, and tried to upgrade it to the latest pdfjs version (4.5.136). When the application starts, I get an error 404.3 for two .mjs files not found (viewer.mjs and pdf.mjs). In your version back in 2022 there weren’t any .mjs files, the equivalent were .js.

I added handlers for .mjs static files in my web.config, and then I get the errors:
Failed to load module script: Expected a Javascript module script but the server responded with a MIME type of “application/octet-stream”.  Strict MIME type checking is enforced for module scripts per HTML spec.

Any suggestions would be greatly appreciated.

Best,
Alex

Thanks Julie & Frank.

I’m experimenting with getting all of the DGVs to behave properly now.  I’m finding it very difficult to get this to work. (Visual Studio 17.10.4, WiseJ designer 3.5.10, WiseJ runtime).

• Upgrading to the latest WiseJ fixed a TON of designer bugs – awesome!
• Main problems now:
  • TableLayoutPanel with 7 rows, 1 column
    • row with FlowLayoutPanel with button & label
    • 6 rows each holding a single DGV, rows are set to AutoSize
• All DGVs are set to AutoSize=true – they do indeed size to content height-wise, but they retain their original designer width regardless of the content.
• Setting the DGVs to Dock:Fill causes them to disappear from the designer (they end up with a height of 0).
• Setting AutoSize to false then Dock to true sets the width, but then setting AutoSize back to true makes the DGV disappear.
• Selecting DGVs in the designer doesn’t work correctly – clicking on the DGV selects the column object.  Right-clicking does select the entire DGV, so that’s a workaround.

I’ll give all the links the Julie supplied a read…  I’m VERY familiar with Windows Forms, so all of these concepts are well known to me.  Even in Windows Forms, the interactions between Dock and AutoSize are not always well behaved – years of building UIs has taught me what works in WinForms – I’m trying to make that knowledge work with WiseJ!

Hi Carl,

all of this can be done with Wisej.NET and its DataGridView.

Use AutoSizing by mode:
https://docs.wisej.com/docs/controls/lists/datagridview#autosizing

Or use the AutoResize* functions and fine tune with Fill Width and MinSize/MaxSize

For Flowlayout you can use Docking.

ReadOnly is simply a property.

Best regards
Frank

You can only set URL parameters- you cannot set the http header in the iFrame URL. You cannot inject an HTTP Header in the iFrame request.

You will need to handle the request on the server side.

Consider using postMessage: https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage

1. For your question of “Should this work?”- No, there are security restrictions preventing it from working. This is by design- think of the HtmlPanel as being in a sandbox, isolated from the main app. However, there is a workaround where you can use the InitScript property to execute the JavaScript- see this forum post for an example: https://wisej.com/support/question/using-html-in-an-html-panel

2. Regarding the IFramePanel, you are correct in that you would need to supply a URL to use the IFramePanel. I wouldn’t recommend using the IFramePanel for this anyways, as it will be subject to CORS restrictions. You can execute javascript code in the IFramePanel, but there will be some difficulty in getting it to interact with the main app. You would need to implement a way to send and receive messages using the postMessage() APIs.

3. Re: Where should I put the .js files and how should they be referenced in the HTML?
You have several options for running JavaScript code in Wisej:
1. As I mentioned earlier, you can use the HtmlPanel and do something similar to https://wisej.com/support/question/using-html-in-an-html-panel. That example loads javascript from a cdn (the ChartJS library) but it should also work when loading javascript from a filepath.

2. You can use the Widget class, see: https://docs.wisej.com/docs/controls/content/widget and https://docs.wisej.com/api/wisej.web/content/widget
We use this to integrate third-party JavaScript applications, but you can use it to run your JavaScript code. If your put your javascript code in the InitScript, it will run when the widget is created. Alternatively, if you want to keep your javascript code in a separate file, you can reference that file using the “Packages” property, which can be set in the designer. Once you have added a package, for the “Source” simply put the relative filepath to your script. You can then call whatever javascript methods you need from your code in the InitScript. I recommend this method, as it integrates the most closely into the rest of the application.

3. You can use the JavaScript Extender. Simply search for “JavaScript” in the Toolbox, then drag and drop the extender into the designer.
see https://docs.wisej.com/docs/concepts/javascript and https://docs.wisej.com/api/wisej.web/extenders/javascript

You may find the SetJavaScriptSource function helpful as it lets you load JavaScript from a file: https://docs.wisej.com/api/wisej.web/extenders/javascript#setjavascript-control-script

4. You can use the Call and Eval functions to call JavaScript code from your C# code.
https://docs.wisej.com/api/wisej.web/general/control#call-function-args
https://docs.wisej.com/api/wisej.web/general/control#eval-javascript
https://docs.wisej.com/docs/concepts/javascript has some code examples that use Call and Eval.

Hope this helps!

-Julie

.dx-datagrid selects an element with the class “dx-datagrid”:
<div class="dx-datagrid"></div>

But #dx-datagrid selects an element with the id “dx-datagrid”:
<div id="dx-datagrid"></div>

If you run the sample and press F12 to open the Developer Tools, then look at the DOM (Click on the “Elements” tab), you can see that Wisej uses ID extensively- lots of divs with ids like “id_1”, “id_2”, etc.

When the Developer Tools are open, If you do ctrl+F and search for “dx-datagrid” you can see an element with the class “dx-datagrid” in the DOM. (See screenshot.) This is the element that we find by doing $("".dx-datagrid"").

Note that the element that we want does NOT have the id “dx-datagrid”, in fact there is no element with that ID in the DOM! So that is why $(""#dx-datagrid"") does not work.

I highly recommend using F12/Developer tools when debugging widgets. Here I just used it to look at the DOM, but you can also look at the javascript code that is being run and even set breakpoints! It’s very useful.

I briefly looked at your sample and at the SpreadJS documentation. One potential issue that I see is that you might need to reference the “excel.io” script. You can do this in the designer under “Packages”. You can either reference a script in the file directory (like your other scripts) or reference it from a cdn. I couldn’t find a cdn for it, so it’s probably best to download the script and reference it in the file directory.

Also a note on debugging, in case you don’t already know- if you press F12 to open developer tools, and click on the “Sources” tab, you can see the javascript that is being run. You can even set breakpoints in the javascript, and hover over variables to see their values. This is quite helpful- I was able to set a breakpoint in the “LoadXL” function on line 129, so I can verify that it is in fact being called when you click the button. See screenshot.

For further assistance, you’ll need to refer to the SpreadJS documentation, as this is really a SpreadJS issue and not a Wisej issue.

Relevant SpreadJS documentation:

https://developer.mescius.com/spreadjs/docs/getstarted/quick-start/importing-files

https://developer.mescius.com/spreadjs/docs/excelimpexp/excelclient

Since apparently the folks at WiseJ don’t get notified about comments, I’ll post this as an “answer”.  I strongly suspect that this is the culprit:

The VWG component “HtmlBox” is implemented as an <iframe>, while the WiseJ “HtmlPanel” is implemented as a <div>.  So, the question becomes, is there a control in WiseJ that wraps an <iframe> and if not, what does it take to make one?

Or am I wrong?

I see that there is an IFramePanel component, but it only accepts a URL – I need to supply the content to the control as HTML, not via a URL…