[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x

UI/UX

143

Solutions

290

Contributors

UI stands for User Interface and UX for User Experience. While there are key differences between the two, both concern the design of how humans interact with computer systems and software.

Share tech news, updates, or what's on your mind.

Sign up to Post

Hi There,

I have 3 dynamically constructed Textboxes (input) (Location, keyword, Contributor) on a reactjs application.   I want to filter the below list of checkboxes onChange event of input boxes (Text box).  It is a react redux application.  Please see the embedded image to have a complete idea about UI.   Please suggest how to achieve this result.

to handle onChange event of dynamically created input boxes
Please see the below code which I had done to create this gui on reactjs.

export default class SearchOptions extends Component {
  constructor(props) {
     super(props);
     //this.updateFacet = this.updateFacet.bind(this);
     this.onInputBoxChange = this.onInputBoxChange.bind(this);
  }

  /*updateFacet(key,value,isChecked) {
      console.log("updateFacet - " + isChecked);
      this.props.actions.updateFacet(key,value,isChecked,false);
  }*/

  onInputBoxChange(e,items,key) {
     items.map(i => console.log(i.value + " count (" + i.count + ")" ));
     console.log("target - " + e.target.value);
     var keysList = items.filter(i => i.value.toLowerCase().indexOf(e.target.value.toLowerCase().toString()) >= 0 ? true : false);
     console.log(keysList);
  }

  createListKeyValues() {
        const listKeyValues = (
          <div style={{marginLeft:10}}>
          {(()=>{
               return i.items.slice(0,3).map((j) => {

                  const label = j.value.charAt(0).toUpperCase() + j.value.slice(1);
                  const count = j.count && j.count > 0 ? ` (${j.count})` : '';

Open in new window

0
Determine the Perfect Price for Your IT Services
Determine the Perfect Price for Your IT Services

Do you wonder if your IT business is truly profitable or if you should raise your prices? Learn how to calculate your overhead burden with our free interactive tool and use it to determine the right price for your IT services. Download your free eBook now!

I have a .Net developer creating a DLL that we are going to Reference in an Access VBA application.  However, whilst we can see the DLL methods (once referenced), he is struggling with a couple of aspects such as passing variables through and how best the code the .DLL so that Intellisense works as expected.

Whenever I have worked with external references in the past, I usually access them like this (rough example):

Dim obj1 As New TSDialler.Dialer
obj1.SignalKey = "ABC123456"
obj1.TelephoneDestination = "0123456789"
obj1.InternalID = "ZYX987"
If obj1.MakeCall = 1 Then
    MsgBox "Call made"
Else
    MsgBox "Call not made.  Error: " & obj1.ReturnMessage
End If

Open in new window


However, he has never worked in VBA and is struggling with the various aspects.  His list of questions is below, but I was wondering if anyone had any links/suggestions for him to look at (more than just answering his questions).

Which kind of methods works?
Do properties work?
Constructors work, what about parameters?
How to do event pattern for a custom class and not UI control?
What pieces (that we use regularly) in C# that does not work with VBA when referenced?
Any article/doc that can be referred that has details for questions like above?


Any help would be greatly appreciated - sorry it's so vague.
0
Best way to display form results to user in timeline

Screen-Shot-2018-11-12-at-10.36.27.png
above is a snap of the timeline i am making

the engagement section is data that is entered into a form to a table and i want to show this information on a timeline but im stuck on how to show this to the user. for best ui or ux


any tips ?
0
Hi, need help to create 1000 VMs to map with direct network ID from python script to call API but it didn't well.

Direct network error: private cloud contains network[1c948756-db50-4871-b03d-d911ecdcae16]', 'code': '400'}}"

Virtual Private Cloud no issue but just can't ping the IP from Python Script being created but when using UI to create and point to the direct network is okay.

Where can i find the right API call to query the direct network ID?

You see click on the below link to download  from google Drive to view the creation process for better understand.

https://drive.google.com/file/d/1ZgYSXrUiODPQk_v6HV7sUZD_UpQ6DMJQ/view?usp=sharing

Thanks.
0
I'm still relatively new (new in the sense I know how to use GIT to check in / check out files) to the world of Git, and feel like this is a pretty simple question.

I'd like to create a list of all the files that I've staged (this particular case it's ~40 or so files) and am ready to commit. I'd like to take that said package of files and simply deploy them to my STAGING server. Normally, I'd just do this manually, but it seems like a lazy approach, and I should be taking full advantage of the tools I'm using.

I'm running in a windows environment, and am looking for something I can run from the console, or ideally, a way to use the GitKraken UI to do this.
0
I have an app written in Keno UI (Telerik).  I'm using build.phonegap.com to build runtime for my app, using cordova and Kendo.  I'm stuck on getting the speechrecognition plugin to initialize.  I'm sure it's something stupid but I'm not sure what it is.
Below is a copy of my config.xml file:

<?xml version='1.0' encoding='utf-8'?>
<widget id="ca.xyz.mmb" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
    <name>mmb</name>
    <description>
        Integrated Mobile Billing for XYZ Customers
    </description>
    <author email="support@xyz.ca" href="http://xyz.ca">
        Go Team
    </author>
    <content src="index.html" />
    <plugin name="cordova-plugin-compat" spec="^1.2.0" />
    <plugin name="cordova-plugin-file" spec="^4.3.3" />
    <plugin name="cordova-plugin-speechrecognition" spec="1.2.0" />
    <access origin="*" />
    <allow-intent href="http://*/*" />
    <allow-intent href="https://*/*" />
    <allow-intent href="tel:*" />
    <allow-intent href="sms:*" />
    <allow-intent href="mailto:*" />
    <allow-intent href="geo:*" />
    <platform name="android">
        <allow-intent href="market:*" />
    </platform>
    <platform name="ios">
        <allow-intent href="itms:*" />
        <allow-intent href="itms-apps:*" />
    </platform>
    <engine name="ios" spec="^4.3.1" />
</widget>

Open in new window

Below is a snapshot of the relevant part of the build.
Build Date: 2018-10-16 05:38:36 +0000

Open in new window

0
I have a C# interface exposed to C++ via COM (tlb file),In this interface function i want to send array of  a Object s Object .Class of this object is complex and have different datatypes.I am using Connection pointer for call backs. Now my point is how can i use Safearrays to transfer data from C++ to C# UI.
0
We have a ESXi 6.5 host. I was able to ssh and use web ui to access before . It does deny access to both now. I can only use direct console to log on.
Which log file to look for deny access reason?
0
Within my VFP environment - and ONLY within my VFP environment -  I appear to have lost the abiility to use menu hotkeys.

For example, the ALT key still wakes up the UI menu, but I can't activate the Tools menu by pressing "T". If I cursor along to it or click it, I can see all the hotkeys underlined as usual, but none work. eg, if type "b" to open the debugger, nothing happens. I can only open it by cursoring to it or clicking on it.

That's weird enough but here are the complications/clues.

First, I'm getting the same behaviour on my two main development workstations. But not my laptop.

I get the same behaviour with vfp programs I've compiled on those machines; but ONLY if I run them on those machines. My clients running the same software on their workstations have no problem accessing the menus in the normal way.

Clearly its some kind of environment issue and clearly whatever I've done on one of the workstations, I've repeated on the other, but not on the laptop.  I should add that I've only had this problem since some time earlier this year. (Didn't note the date as I assumed it was a transient fault and would disappear with the next reboot or whatever. Then it just became a background irritant). I should also mention that the two workstations are running on different W10 versions (1511 and 1709, both 64 bit)

I do tweak windows quite radically (using Winaerotweaker and other tools for example) but I tend to be pretty consistent and can't imagine what I…
0
I recently got an older server. 6gb RAM, 1x2tb RAID array. 4 core CPU. Literally an old file server.

I upgraded their server and took this one.

It originally came with Server 2008, but I was unable to recover the key (they wiped the drives and it didn't have a sticker on it.

I was wondering of a linux OS with a web-based GUI. I have used Webmin in the past, and I like it, but it doesn't seem to be updated very often.

I want to know if there are any similar to you Webmin that you like to use. I don't really want to hang out in my office staring at a screen and I ain't great with terminal commands (through SSH). I like the module options like in Webmin. I have also tried Cockpit project, but it doesn't have much on it. And ClearOS is not that easy to use when setting up samba share. Amahi, I have the same issues.

What are your recommendations??
0
Problems using Powershell and Active Directory?
LVL 8
Problems using Powershell and Active Directory?

Managing Active Directory does not always have to be complicated.  If you are spending more time trying instead of doing, then it's time to look at something else. For nearly 20 years, AD admins around the world have used one tool for day-to-day AD management: Hyena. Discover why

I've used Ron de Bruin's Custom UI Editor for a while now, and looking at my xml code you can see I'm not expert. I simply started years ago with his sample file and modified it (very carefully) to my needs.

I've used it in several projects and never had a problem. But this latest one has me stumped. I created an excel workbook with the attached VBA code as I always do, then modified an existing Custom UI project as always. But although as far as I can tell I've done everything exactly as I have in the past, I'm getting an error stating "Cannot run the macro 'ixxxxxxxxx'. The macro may not be available in this workbook or all macros may be disabled"

The trust settings are correct; allow all macros and VBA access. I thought perhaps I had fat-fingered some code somewhere so I used Custom UI Editor to generate the callbacks and they were identical to what I had, but I used them anyway.

I can run all of the subroutines from the macro window with no problem, but I'm at my wits' end trying to figure out what's wrong with my code this time around.

Any help would be greatly appreciated. I'll include my UI xml code and my vba code as well. I'm sure it's probably something simple, but for the life of me I can't find it.Mortgage-Analysis-VBA.vb.txtMortgage-Analysis-UI-Code.txt

As you can see, I haven't even changed the icons in the UI code. I haven't made it that far.
0
Hi all,

I am trying to create a page using the jquery UI 'draggable'

I have for example a number of items on the page located at various positions, say:
 15, 16
 18, 22

Now, if I set the grid to 10, 10 I would like to be able to drag these so that they snap to the 10,10 grid, i.e.
  15,16 --> 20,20
  18,22 --> 20,30

However if I use the code as per the example, it actually moves the item by the grid size, rather than snapping to a specific grid.
For the above example,
  15,6 would snap to 25,16 then 35, 16 etc.
  18,22 would snap to 28,22 then 38,22 etc.
and they would not appear on the same grid.

I have created a fiddle to show the problem - in this you can drag the two items over one another but they do not quite line up.
https://jsfiddle.net/xvLgcetn/1/

Am I missing something obvious??

Any help would be appreciated.

Many thanks,

James
0
exported pdf
I am tried to export pdf UI grid data along with multiple line title and image logo. its setting only first three line as title line even there was more than 3 line in code.
exported pdf file has been attached and wan  to set logo yellow mark position on pdf.
Could you please help me? Thanks in advance


vm.gridOptions = {
                enableFiltering : true,
                enableGridMenu : true,
                onRegisterApi : function(gridApi) {
                    $scope.gridApi = gridApi;
                },

                exporterCsvFilename : 'myfile.csv',

                  exporterPdfHeader: {
                        text: [
                            'line 1',
                            {text: 'hello altruist\nplease \nhelp me'},
                            'end of line 1\n',
                            'Second line \n',
                            'Third line\n',
                            'fghfhgf line\n',
                            'Third line'
                        ], style: 'headerStyle'
                    },

                    exporterPdfFooter: function ( currentPage, pageCount ) {
                          return { text: currentPage.toString() + ' of ' + pageCount.toString(), style: 'footerStyle' };
                        },
                        exporterPdfCustomFormatter: function ( docDefinition ) {
                            docDefinition.styles.headerStyle = { fontSize: 10, bold: …
0
Hi experts,

I'm using the Telerik UI for ASP.NET AJAX RadWindow.
https://demos.telerik.com/aspnet-ajax/window/examples/overview/defaultcs.aspx

I'm using ASP.NET and VB.

I saw this example here for passing a parameter from the Main page to the RadWindow:

Using RadWindow as a Dialog
https://docs.telerik.com/devtools/aspnet-ajax/controls/window/how-to/using-radwindow-as-a-dialog

I recreated this example and it works fine.

This is the working code:

RadWindow1_MainPage.aspx

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="RadWindow1_MainPage.aspx.vb" Inherits="RadWindow1_MainPage" %>

<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script type="text/javascript">

        // https://docs.telerik.com/devtools/aspnet-ajax/controls/window/how-to/using-radwindow-as-a-dialog

        // The OnClientShow event handler sets the argument to the dialog being opened
        function clientShow(sender, eventArgs) {
            // When the showRadWindow1 button is clicked the value from the textbox is pass to RadWindow1 as an argument
            var txtInput = document.getElementById("txtInput");
            sender.argument = txtInput.value;
        }
        // The OnClientClose event handler receives the result of the dialog and responds
        function clientClose(sender, args) {
        

Open in new window

0
Hello ;
I want to design a GUI.my application is as bellow :
while compiling my program , a first interface is displayed : it is for user authentication, by validating this step ,another interface is displayed :this interface is devided into two screen  show(Splitter with two column) the second interface is combined : a menu , and a tree view .by clicking in one item , a data and controls are shown in the right of interface.
To do this application , did I need for SDI or MDI
Also how to navigate between the two interfaces (the authentication interface and the second interface), should I use two Documents ?
For the first interface , I just want a simple area which display the logo of company and an edit control for tapping the Password. but since compiling the project ,always a classic dialog box is shown (made by Microsoft ).
Is there any idea which clarify my needs.
Kindly.
0
Hello. We are using GASSMO to connect google accounts to Outlook 2016, and what we want to do for a particular user is archive their entire "mailbox" before 2015 in a single PST file. The 2016 UI has an option to "clean up mailbox", which allows this, but that immediately moves the mail from their mailbox to the PST file, and we don't want that. We'll remove the mail from his online mailbox later.

However, when we go to File>Export, it has filters for sent and received and we can set date ranges for that, but what if I want to archive ALL mail (sent and received) before 31/12/2015 (to minimize the number of local PST files)? How would I do this? Thanks.
0
I installed the WSUS role on a SErver 2016 server but have received a messaged that the WSUS Post-deployment configuration failed.

I have attached the log file for this error.

What do I need to do to fix this issue?

Here are the contents of this file:

2018-07-13 07:10:31  Postinstall started
2018-07-13 07:10:31  Detected role services: Api, Database, UI, Services
2018-07-13 07:10:31  Start: LoadSettingsFromXml
2018-07-13 07:10:31  Start: GetConfigValue with filename=UpdateServices-Services.xml item=ContentLocal
2018-07-13 07:10:31  Value is true
2018-07-13 07:10:31  End: GetConfigValue
2018-07-13 07:10:31  Start: GetConfigValue with filename=UpdateServices-Services.xml item=ContentDirectory
2018-07-13 07:10:31  Value is \\bitcaad01\wsus$\
2018-07-13 07:10:31  End: GetConfigValue
2018-07-13 07:10:31  Content directory is \\bitcaad01\wsus$\
2018-07-13 07:10:31  Start: GetConfigValue with filename=UpdateServices-DB.xml item=InstanceName
2018-07-13 07:10:31  Value is bitcasccm01.bayitnc.com
2018-07-13 07:10:31  End: GetConfigValue
2018-07-13 07:10:31  SQL instance name is bitcasccm01.bayitnc.com
2018-07-13 07:10:31  End: LoadSettingsFromXml
Post install is starting
2018-07-13 07:10:31  Start: Run
2018-07-13 07:10:31  Fetching WsusAdministratorsSid from registry store
2018-07-13 07:10:31  Value is (null)
2018-07-13 07:10:31  Configuring content directory...
2018-07-13 07:10:31  System.UnauthorizedAccessException: Access to the path …
0
Hello,

I am trying to come up with a solution in WPF to solve a UI issue I am having.

If you look at the attached wire-frame for the UI you will see that I'm trying to make a grid of sorts. The top portion of each row contains 'static' data (will always show # animals, species, gender, etc), but the bottom portion (additional details section) is more dynamic. If you look at the wire-frame you will notice that groups 1 and 2 have 5 attributes and group 3 has 8. This 'footer' section should support (n) attributes.

I'm not sure how to go about solving this issue. WPF datagrids re pretty limited so I don't know how to make this concept work with that. It doesn't necessarily have to be a datagrid, as long as I can solve the problem (even if there is a 3rd party control that could handle this, that works too).

Anybody have any ideas on where to get started?

0
Hi everyone,

I have the following AJAX call which updates portion of a page at 5s interval. The code works fine excepts that it appears as though the whole page is being refreshed, rather than just the values of the <p>. The page blinks briefly at every call, causing a horrible user experience. Any ideas why?

setInterval(function(){
        $.ajax({
         url:base_url+'dashboard/getLastTickets',
         method:'GET',
        success:function(data)
        {
            data = $.parseJSON(data);
        }
        });

        var ticketContainer = "";
        var i = 0;
        for (i=0; i<data.length; i++){
                ticketContainer = "ticketContainer" + data[i].service_code;
                document.getElementById(ticketContainer).html = data[i].service;
        }
}, 5000);

Open in new window


I did try to include the for loop within the AJAX call, but that did not solve the issue. Thanks for your help.
0
SolarWinds® VoIP and Network Quality Manager(VNQM)
SolarWinds® VoIP and Network Quality Manager(VNQM)

WAN and VoIP monitoring tools that can help with troubleshooting via an intuitive web interface. Review quality of service data, including jitter, latency, packet loss, and MOS. Troubleshoot call performance and correlate call issues with WAN performance for Cisco and Avaya calls

Hi,

Anyone can advice why i can't create new mailbox database either from UI or powershell? See attached error.

Yesterday, I can create very fast by UI but today i can't create the new mailbox database anymore.

Ps advice how to do it as i am stuck now.

Tks.

Lucky
new_db_error.jpg
0
Top-10-Typography-Trends-You-Can-Hea.jpg Typography breathes the essence of life into your design. It not only describes the product you are marketing, but it also adds a personality to it. An effective typography on your website ensures that your design stands outside the circumference and above the competition.

If you are about to make a pick on how your website typography explains your brand to the world, then you need to update yourself on the latest trends. Here are some of the most trending fonts that are taking an upsurge into the world of typography this year.

Check out this amazing #infographic which recently got published on the Branex, a website design agency of the future.

Top 10 Typography Trends You Can't Afford to Miss In 2018
0
I use Excel 2016 with classic VBA. I do not use .NET.
Due to a windows 10 system crash, I have to reload the XML Custom UI editor for Microsoft Office, for use with MS Office 2016 (Excel).
When I tried to download the app from the web, I got a request to install ,NET which I did not get when I first installed the XML editor, pre-crash.

What is the correct procedure for downloading Custom UI editor for Microsoft Office, for use with  excel 2016?
Which site ought I to download the xml editor from?

Recommendation for an additional more agile freeware XML editor would be appreciated.

Thanks,
Kelvin
0
Hi,

I was looking for some guidance on the approach to a specific user experience and how people would approach it or if someone has done something like this already.

I have a simple PHP script that enters a value from a text box into the database when the 'add' button is clicked or the user hits enter after entering a value (script below).

What I would like to do is allow a user to hit the enter key when they add their record (as it works below), but if the user were to hit the enter key again, within 4 seconds, it would bring up the full record that they could edit. It is because sometimes the user will only add the one value, but sometimes they will add the one value and also want to view and edit some other fields for that record - how would others approach this from a scripting perspective and also side topic on the User Experience side; are there better ways to do this?




$form = "<form action='./dash_hit46.php' method='post'>" .PHP_EOL;
$form .="<input type='text' id='newadd' name='newadd' placeholder='e.g. x'>" .PHP_EOL;
$form .="<input type='submit' value='add' name='add'>" .PHP_EOL;
$form .="</form>";


if ($_POST['add']){
	
	$newadd = $_POST['newadd'];
		if ($newadd){

		
		// Check connection
if ($conn_task2->connect_error) {
    die("Connection failed: " . $conn_task2->connect_error);
} 

$sql = "INSERT INTO main (tsk_name, tsk_person, tsk_user_link)
VALUES ('$newadd', 'me', '$UID')";

if ($conn_task2->query($sql) === TRUE) {
    echo "New

Open in new window

0
3 LinkedIn Tools
The LinkedIn platform has been widely used by brands to communicate with the audience and improve their customer service. Similarly, the network has to do it right. Here are 3 tools that make LinkedIn so good.
0
In this code I'm trying to display table inside table running PHP for loop. I'm able to get the data but unable fix the UI and accordion.I have created the table with in the table but the second table is showing on side,i need that in the next row and also accordion should Work.Please help me Friends.
 <div>  <h1>Payment Detail</h1> </div>

    <input type="text" id="search-payment-detail" />
    <a href="/admin/member-payment-detail">Add Member Payment Detail</a>
    {{--{{dd($payment_details)}}--}}
    <div id="prefetched">
        <table class="table table-bordered">
            <thead>
            <tr>
            <td>Name</td>
            <td>Email</td>
            <td>Mobile</td>
            <td>Role</td>
            <td>Status</td>
            </tr>
             </thead>
            <tbody>
         @foreach($payment_details as $payment_detail)
        <tr class="tableshow">
            <td>{{$payment_detail->sc_fullname}}</td>
            <td>{{$payment_detail->sc_email}}</td>
            <td>{{$payment_detail->sc_mobile_no}}</td>
            <td>{{$payment_detail->role}}</td>
            <td>{{$payment_detail->status}}</td>



            <td><table style="display:none;width:100%" class="collapseshow table table-bordered">
                @foreach($payment_detail->payementDetail as $pd)

                        <td class="width:100%">p1: {{$pd->p1}}</td>
                        <td>p2:{{$pd->p2}}</td>
                        <td>p3:{{$pd->p3}}</td>
           

Open in new window

0

UI/UX

143

Solutions

290

Contributors

UI stands for User Interface and UX for User Experience. While there are key differences between the two, both concern the design of how humans interact with computer systems and software.