Author: Mr.M

Hi DW. Does anyone know how can I clear a devtool network monitor log of a browser using javascript.

I know the console.clear() only clear the console log not the network monitor tool logs.

Hi DW. I have code:

<div class="lv-item media">
<div class="lv-avatar bgm-purple pull-left">u</div>
<div class="media-body">
<div class="lv-title">dynamically_generated_value</div><!-- I want to get this value -->
<div class="lv-small">Sample text</div>
</div>
</div>

I use the following code to activate the selected list. NB the above is also dynamically generated for simplicity let say we have the above code with a unique lv-title value as it's the user chat id so it unique. And I want when I click this element I want to get that child class by name of the selected item. Here's the code I use to set the active when the user click the element.

var chatheader = document.getElementById("uchatlist");
var lvitem = chatheader.getElementByClassName("lv-item media");
for(var i = 0; i < lvitem.length; i++){
lvitem[i].addEventListener("click", function (){
var lvitemcurrent = document.getElementByClassName("lv-item media active");
lvitemcurrent[0].className = lvitemcurrent[0].className.replace(" active","");
this.className += " active";
// Here is where I want to get the title value of the clicked element. 
});
}

NB the fist code is inside a div with a class uchatlist

What I'm doing is a chat system on the left it has a list of users which is what when you click I want to get its title value so that I will be able to show and hide the messages or chats on the right hand side for the selected user. On the right it's where the end user and chat and see the response messages as well. So I want to show this for each user when the user is being clicked from the left and show its chats on the right.

Hi DW. I'm creating a chat system which will alow guests to send DMs to the operator and the operator can reply to it. I'm using MYSQL as my database, fingerprint2js for identifying the user since user has not yet logged in or registered but want to first communicate with the admin.

Scenario here is that the user has sent 2 messages which are bot recorded separately on the database but have the same uid which is the id used to identify the user. My problem is that even the admin when replay he will also use this same uid so the uid is having many duplication as they communicate, issue is that it's not only the two people communicating but others as well which makes it have many duplicates of each uid.
What want to achieve withe the select is to get only a single uid of each even if its its duplicate or not but get one of each so that will be able to iterate through each user and be able to sort their messages for displaying purpose. At the moment I have 2 rows with the same uid but when I use select and while since the number of rows are two it runs twice which end up producing same result twice. On the display side get 4 messages because for each iteration it return both rows when on my select statement I select where uid equal id which is returned by a select all from xchat table where msgfrom equal user. This returned all the uids of the messages since it's only the user that starts a chat now the issue is that a user or admin can send more than one message, how can I get all uids but for duplicates only get 1 id of each so that when I work with it only work once even if there are more than one same uid on the database and also get those that are not duplicates as well.

Thanks.

Hi DW.

I want to get a message only on that specific targeted tab id. If the messege is sent to tab id 2, it should run a script under tab id 2 to update that page displayed or for simplicity log on tab id 2 console the message.

The tab id is from background script so it then sends a message to that tab id, here is an example:

chrome.webNavigation.onCompleted.addListener(function(details){
    doThis("my_Message", details);
    }

    function doThis(msg, to){
    chrome.tabs.query({active: true, currentWindow: true}, function(tabs){
        //console.log("vvv: " + tabs[0].id);
        chrome.tabs.sendMessage(to.tabId, {action: msg, data: "test"}, function(response){
            if(chrome.runtime.lastError) {
      const rw = setTimeout(() => {doThis(msg);}, 1000);
     clearTimeout(rw);
    } else {
            console.log("Message sent from background");
    }
        });
    });
}

Now my receiving part:

chrome.runtime.onMessage.addListener(function(msg, sender, response){

console.log(sender.id);
console.log(msg);
return true;
}

Hi DW.

I'm trying to display a popup over an input box, but the issue is that some websites that I want to also display on have div class name that contains many classes in it which result it a div class name to have spaces in it which is not a problem.

I would have used id for this but the issue is that some site doesn't have the ids. if you would take the facebook sample code:

<div class="_6lux">
<div class="_6luy _55r1 _1kbt" id="passContainer">
<input type="password" class="inputtext _55r1 _6luy _9npi" name="pass" id="pass" data-testid="royal_pass" placeholder="Password" aria-label="Password" />
<div class="_9ls7" id="u_0_b_sX">
<a href="#" role="button">
<div class="_9lsa">
<div class="_9lsb" id="u_0_c_3V">
</div>
</div>
</a>
</div>
</div>
</div>

So with the above what I want is to get the div with class _6lux because this work if I use that div but if I use any element inside that div it doesn't work correctly. The popup I want to show on a password field of that particular open website is Popup source link

Now if you also take Daniweb as another example code is

<div class="form-group">

<label for="password901886946" class="control-label d-none">Password</label>

<input type="password" class="form-control" id="password901886946" name="password" placeholder="Password">

</div>

And for Daniweb it work correctly with this div with class form-group. What I'm trying to do is to be able to dynamically locate the correct div that will correctly display this popup over the password field. I inject the same css code from the above link to the open website then also inject

var popup = document.getElementById("mypopup");
  popup.classList.toggle("show");

which triggers to display or hide the popup. My full css and dynamic selecting of the div code is

var inputs = document.getElementsByTagName('input');
    var dynamicclass;

for(var i = 0; i < inputs.length; i++) {
    if(inputs[i].type.toLowerCase() == 'password') {
        // Trying to get the id of this element
         var eid = inputs[i].id
         parentDiv = inputs[i].parentNode;//.className;

        if(parentDiv.className.includes(" ")){
        // Here was trying to switch from class to ID of the actual field but it doesn't work
        dynamicclass = "#"+inputs[i].id;
        }else{
            dynamicclass = "."+parentDiv.className;
        }
    }
}


    document.getElementsByTagName('head')[0].insertAdjacentHTML("beforeend","<style>"+dynamicclass+" {position: relative;display: inline-block;cursor: pointer;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}"+dynamicclass+" .popuptext {visibility: hidden;width: 160px;background-color: #555;color: red;text-align: center;border-radius: 6px;padding: 8px 0;position: absolute;z-index: 1;bottom: 125%;left: 50%;margin-left: -80px; backgroundColor: red;}"+dynamicclass+" .popuptext::after {content: '';position: absolute;top: 100%; left: 50%;margin-left: -5px;border-width: 5px;border-style: solid;border-color: #555 transparent transparent transparent;}"+dynamicclass+" .show {visibility: visible;-webkit-animation: fadeIn 1s;animation: fadeIn 1s;}@-webkit-keyframes fadeIn {from {opacity: 0;} to {opacity: 1;}}@keyframes fadeIn {from {opacity: 0;}to {opacity:1 ;}}</style>");

document.getElementById(eid).insertAdjacentHTML("beforebegin","<span class='popuptext' id='mypopup'>A Simple Popup!</span>");

The above work well with Daniweb. So my question is how can I make this work for all websites which I also don't know but it would be best if this can work on the majority of the websites.

Hi DW.

Anyone knows how I can get the device name the browser is running on? I mean something like on the attached image with Javascript?

How can I perform both ajax and form post sametime? currently the code only sends one that is called first and dont call the second one